jQuery根据锚点的点击改变选择框的值

jQuery change the select box value based on anchor clicked

本文关键字：选择 改变 jQuery      更新时间：2023-09-26

当有人点击链接时，我需要改变选择框的值

<a class="cli" href="0">Jan</a>
<a class="cli" href="1">Feb</a>
<a class="cli" href="2">Mar</a>
<a class="cli" href="3">Apr</a>
<a class="cli" href="4">May</a>
<a class="cli" href="5">Jun</a>
[...]
<a class="cli" href="11">Dec</a>
<select class="ui-datepicker-month">
<option value="0" style="display: none;">Jan</option>
<option value="1" style="display: none;">Feb</option>
[...]
<option value="9" style="display: none;">Oct</option>
<option selected="selected" value="10" style="display: none;">Nov</option>
<option value="11" style="display: none;">Dec</option>
</select>

这是我到目前为止所做的，我以为它会很简单，只是我无法理解它:

$("a.cli").click(function(event){ //when anchor is clicked
            event.preventDefault();
            $(".ui-datepicker-month").val($(this).text());
        });  
    });

我也试过了

$("a.cli").click(function(event){ //when anchor is clicked
        event.preventDefault();
        $(".ui-datepicker-month").val($(this).attr("href"));
    });  
});

还是不行

由于value值保存在href属性中，因此使用:

$("a.cli").click(function(event){ //when anchor is clicked
    event.preventDefault();
    $(".ui-datepicker-month").val($(this).attr("href"));
});

为什么更改值而不选择具有"clicked"值的选项?

<a class="cli" href="0">Jan</a>
<a class="cli" href="1">Feb</a>
<a class="cli" href="2">Mar</a>

<select id="month" name="month" class="ui-datepicker-month">
<option value="0">Jan</option>
<option value="1">Feb</option>
<option value="2">Mar</option>
</select>

脚本:

jQuery('a.cli').click(function(event) {
    event.preventDefault();
    jQuery('#month option').attr('selected', false);
    jQuery('#month option[value="' + jQuery(this).attr('href') + '"]').attr('selected', true);
});

查看http://jsfiddle.net/jchiotaka/uaLXU/

试试这个:

...
<a onClick="$('select.ui-datepicker-month').val('1');">Feb</a>
...

<select class="ui-datepicker-month">
...
<option value="1">Feb</option>
...
</select>
相关文章：