【问题标题】:How to change style of dropdown menu如何更改下拉菜单的样式
【发布时间】:2013-11-24 03:52:34
【问题描述】:

我有一个下拉菜单,但我不知道如何更改...

您可以转到http://www.escalatehosting.com/signup 并输入任何域名,然后在选择结算周期后选择继续。

在注册表单上,您将能够看到下拉菜单非常适合寻找“国家/地区”选项。我正在尝试为“州/地区”下拉菜单做同样的事情,但不知道要更改什么...

这是用于注册表单的代码:

<tr><td class="fieldlabel">{$LANG.clientareafirstname}</td><td class="fieldarea">{if $loggedin}{$clientsdetails.firstname}{else}<input type="text" name="firstname" tabindex="1" style="width:300px;" value="{$clientsdetails.firstname}" />{/if}</td><td class="fieldlabel">{$LANG.clientareaaddress1}</td><td class="fieldarea">{if $loggedin}{$clientsdetails.address1}{else}<input type="text" name="address1" tabindex="7" style="width:300px;" value="{$clientsdetails.address1}" />{/if}</td></tr>
<tr><td class="fieldlabel">{$LANG.clientarealastname}</td><td class="fieldarea">{if $loggedin}{$clientsdetails.lastname}{else}<input type="text" name="lastname" tabindex="2" style="width:300px;" value="{$clientsdetails.lastname}" />{/if}</td><td class="fieldlabel">{$LANG.clientareaaddress2}</td><td class="fieldarea">{if $loggedin}{$clientsdetails.address2}{else}<input type="text" name="address2" tabindex="8" style="width:300px;" value="{$clientsdetails.address2}" />{/if}</td></tr>
<tr><td class="fieldlabel">{$LANG.clientareacompanyname}</td><td class="fieldarea">{if $loggedin}{$clientsdetails.companyname}{else}<input type="text" name="companyname" tabindex="3" style="width:300px;" value="{$clientsdetails.companyname}" />{/if}</td><td class="fieldlabel">{$LANG.clientareacity}</td><td class="fieldarea">{if $loggedin}{$clientsdetails.city}{else}<input type="text" name="city" tabindex="9" style="width:300px;" value="{$clientsdetails.city}" />{/if}</td></tr>
<tr><td class="fieldlabel">{$LANG.clientareaemail}</td><td class="fieldarea">{if $loggedin}{$clientsdetails.email}{else}<input type="text" name="email" tabindex="4" style="width:300px;" value="{$clientsdetails.email}" />{/if}</td><td class="fieldlabel">{$LANG.clientareastate}</td><td class="fieldarea">{if $loggedin}{$clientsdetails.state}{else}<input type="text" name="state" tabindex="10" style="width:300px;" value="{$clientsdetails.state}" />{/if}</td></tr>
<tr>{if !$loggedin}<td class="fieldlabel">{$LANG.clientareapassword}</td><td class="fieldarea"><input type="password" name="password" tabindex="5" id="newpw" style="width:300px;" value="{$password}" /></td>{else}<td class="fieldlabel"></td><td class="fieldarea"></td>{/if}<td class="fieldlabel">{$LANG.clientareapostcode}</td><td class="fieldarea">{if $loggedin}{$clientsdetails.postcode}{else}<input type="text" name="postcode" tabindex="11" style="width:300px;" value="{$clientsdetails.postcode}" />{/if}</td></tr>
<tr>{if !$loggedin}<td class="fieldlabel">{$LANG.clientareaconfirmpassword}</td><td class="fieldarea"><input type="password" name="password2" tabindex="6" style="width:300px;" value="{$password2}" /></td>{else}<td class="fieldlabel"></td><td class="fieldarea"></td>{/if}<td class="fieldlabel">{$LANG.clientareacountry}</td><td class="fieldarea">{if $loggedin}{$clientsdetails.country}{else}{$clientcountrydropdown|replace:'<select':'<select tabindex="12" style="width:285px;"'}{/if}</td></tr>
<tr><td colspan="2" class="fieldarea">{if !$loggedin}<script language="javascript">showStrengthBar();</script>{/if}</td><td class="fieldlabel">{$LANG.clientareaphonenumber}</td><td class="fieldarea">{if $loggedin}{$clientsdetails.phonenumber}{else}<input type="text" name="phonenumber" tabindex="13" style="width:300px;" value="{$clientsdetails.phonenumber}" />{/if}</td></tr>

这是国家下拉菜单的代码,看起来像我想要的那样:

<td class="fieldlabel">{$LANG.clientareacountry}</td><td class="fieldarea">{if $loggedin}{$clientsdetails.country}{else}{$clientcountrydropdown|replace:'<select':'<select tabindex="12" style="width:285px;"'}{/if}</td>

这是我不知道如何修复 State 下拉列表的代码,我不知道如何修复并使其看起来像 Country 下拉列表。

<td class="fieldlabel">{$LANG.clientareastate}</td><td class="fieldarea">{if $loggedin}{$clientsdetails.state}{else}<input type="text" name="state" tabindex="10" style="width:300px;" value="{$clientsdetails.state}" />{/if}</td>

对此的任何帮助将不胜感激......

【问题讨论】:

    标签: php html css smarty


    【解决方案1】:

    国家下拉菜单是从 jQuery 生成的,您可以在下拉菜单中使用该类。

    【讨论】:

    • 我试过这样做,但下拉列表显示为空白。您对生产线进行了哪些更改以使其正常工作?
    • 你的选择标签应该是display:none,然后把你所有的数据放到span标签中,这个span标签你必须把所有在国家的类。
    【解决方案2】:

    国家选择的风格使用ullis

    尝试使用它而不是选择和输入: &lt;ul&gt; 与此类 -> class="selectboxit-options dropdown-menu"

    对于列表中的第一个选项: &lt;li&gt; 与此类 -> class="selectboxit-option selectboxit-option-first active"

    对于其他项目:&lt;li&gt; 与此类 -> class="selectboxit-option"

    【讨论】:

      【解决方案3】:

      这里的主要问题是“selectboxit-text”类未应用于您的状态下拉菜单。我建议检查 css 文件。

      【讨论】:

      • 我实际上已经尝试将其更改为 select 并将样式更改为我想要的样式,但随后下拉列表消失了,我无法弄清楚下拉列表应该更改为什么使用select时仍然显示
      • 你用的是什么模板引擎?
      • 智能模板系统
      【解决方案4】:

      这是一个花哨的引导主题供您选择,可以使用这个bootstrap-select

      【讨论】:

        猜你喜欢
        • 2017-12-27
        • 1970-01-01
        • 1970-01-01
        • 2014-05-27
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多