Question

我发现这对于一个简单的自定义选择框来说是非常好的解决方案 - 它工作得很漂亮，但它只适用于一个选择框。在过去的2到3个小时里，我一直在修补它，我终生不能把它搞清楚，以便适用于所有自定义选择。

问题是这行代码非常具体 - 我需要它来输出应用于它的选择框所特有的文本

 $(".out").text(str);

以下是完整的代码：

$('select[name=Listing_Price_Max]').change(function () {
    var str = "";
    str = $(this).find(":selected").text();
    $(".out").text(str);
}).trigger('change');

感谢Sanddip提供的有用解决方案https://stackoverflow.com/a/16145673/1108360 - 我只需要了解更多信息。非常感谢任何帮助，谢谢！

Answer 1

您可能希望这样做：

 $(this).next(".out").text(str); //Select the div that is next to the selectBox

如果你的结构是这样的：

<div class="selectdiv">
    <select class="selectboxdiv">
        <option>choose preset...</option>
        <option>two</option>
        <option>something</option>
        <option>4</option>
        <option>5</option>
    </select>
    <div class="out">XCZXCzxcxz</div>
</div>

Demo

请参阅.next()

Answer 2

如果要使用jquery创建自定义选择框。您可以在不使用任何第三方大尺寸插件的情况下执行此操作。

您可以使用小型CSS代码对其进行主题化。

我发现这个link对于使用jquery

创建自定义选择框非常有用

http://www.codeinsects.com/stylize-your-select-box-using-jquery-custom-plugin.html

使用jQuery的简单自定义选择框

2 个答案:

Demo