Question

我有一个jquery代码，起初我们只能看到一个组合框或<select>标记。当我单击组合框中的第一个选项时，会出现一个按钮。当我单击按钮时，按钮消失后。问题是，当我再次单击组合框中的第一个选项时，该按钮将不再显示。

Jquery的：

$(document).ready(function(){

    $('.mySelect').change(function(){
        var thisValue = $(this).val();
        $('#'+thisValue).fadeIn(1000);
    });


    $('.myButton').click(function(){
        $(this).hide();
    });

     $('.myButton').hide();

});

HTML：

<select class="mySelect">
    <option value="">Select</option>
    <option value="myButton1">One</option>
    <option value="myButton2">Two</option>
    <option value="myButton3">Three</option>
    <option value="myButton4">Four</option>
    <option value="myButton5">Five</option>
</select>
<input type="button" value="Click 1" id="myButton1" class="myButton"/>
<input type="button" value="Click 2" id="myButton2" class="myButton"/>
<input type="button" value="Click 3" id="myButton3" class="myButton"/>
<input type="button" value="Click 4" id="myButton4" class="myButton"/>
<input type="button" value="Click 5" id="myButton5" class="myButton"/>

Answer 1

试试这个：

<强> http://jsfiddle.net/ZJP4u/5/

$(document).ready(function(){

    $('.mySelect').change(function(){
        var thisValue = $(this).val();
        $('#'+thisValue).fadeIn(1000);
        $(".mySelect").val($(".myButton option:first").val());
    });


    $('.myButton').click(function(){
        $(this).hide();
    });

     $('.myButton').hide();

});

Answer 2

如果再次点击“ONE”，则不会显示，因为SELECT未更改。尝试单击TWO，然后再单击“ONE”。 button1将显示。

在jQuery中，只有当选项框中的选项值发生变化时，您才会尝试淡入按钮。

这就是：

当您在选项中选择一个时，按钮1将淡入。单击button1时，它将消失。现在你选择了ONE，这已经是选择的选项了，所以点击ONE，它不会触发CHANGE。

Answer 3

将您的jquery更改为：

$(document).ready(function(){

    //I added this section
    $('.mySelect').blur(function(){
        var thisValue = $(this).val();
        $('#'+thisValue).fadeIn(1000);
    });
    //End

      $('.mySelect').change(function(){
        var thisValue = $(this).val();
        $('#'+thisValue).fadeIn(1000);
    });    

    $('.myButton').click(function(){
        $(this).hide();
    });

     $('.myButton').hide();

});

blur()处理程序只有在您点击选择时才会触发，但是除非您更改选择然后将其更改回来，否则onchange永远不会触发。

Fiddle

在组合框中第二次单击某个选项时，Jquery将无法运行

3 个答案: