Jquery 单击li时添加值顶部选择选项

需要这方面的帮助，我需要在选择下拉选项上链接这个列表，我需要一个jQuery代码来完成这项工作

<ul class="north">
    <span class="label"><strong>North Island</strong></span>
    <li><a href="#" id="map1" class="northland">Northland</a></li>
    <li><a href="#" id="map2" class="aukland">Auckland</a></li>
    <li> <a href="#" id="map3" class="waikato">Waikato</a></li>
    <li><a href="#" id="map4" class="bayofplenty">Bay of Plenty</a></li>
    <li><a href="#" id="map5" class="gisborne">Gisborne & Hawkes Bay</a></li>
    <li><a href="#" id="map6" class="taranaki">Taranaki</a></li>
    <li><a href="#" id="map7" class="manawatu">Manawatu & Wanganui</a></li>
    <li><a href="#" id="map8" class="wellington">Wellington</a></li>
</ul>

<select name="select2" id="select2">
    <option value="nort">Northland Stockist</option>
    <option value="aukland">Aukland Stockist</option>
    <option value="waikato">waikato Stockist</option>
    <option value="bay of plent">Bay of Plenty Stockist</option>
    <option value="gisborne">Gisborne & Hawkes Bay Stockist</option>
    <option value="taranaki">Taranaki Stockist</option>
    <option value="manawatu">Manawatu & Wanganui Stockist</option>
    <option value="wellington">Wellington Stockist </option>
    <option value="nelson">Nelson & Marlborough Stockist</option>
    <option value="westcost">west coast Stockist</option>
    <option value="canterbuty">canterbury Stockist</option>
    <option value="otago">otago &  Sounthland Stockist</option>
</select>

北岛









北国证券商
奥克兰证券商
怀卡托证券商
丰盛湾证券商
吉斯伯恩&霍克斯湾证券商
塔拉纳基证券商
马纳瓦图和旺加努伊证券商
惠灵顿证券商
纳尔逊&马尔伯勒证券商
西海岸零售商
坎特伯雷零售商
奥塔戈&桑特兰证券商

我需要做的是，当我单击Northland时，将显示类为“norhtland”的选择选项，其余选项将根据我单击的类而显示。希望有人能在这方面帮助我。非常感谢

试试看

$("ul.north li a").click(function (e) {
    e.preventDefault();
    $("#select2").val($(this).attr("class"));
});

注意：LIA标记类和选项值应该是相同的，那么只有它工作

---

无论如何，你必须先尝试一下

$(function() {
    $('ul.north li a').click(function() {
        $('#select2').val($(this).attr('class'));
    });
});

编辑：根据您的

北
南方
北1
北1
南1
南1
$（函数（）{
$（'#选择1'）。单击（函数（）{
$（“#选择2选项”）.hide（）；
$（'#select2 option[value=“”+$（this.val（）+”）.prop（“selected”，true）.show（）；
});
});

此处已更新

请尝试

$("ul.north li a").click(function (e) {
e.preventDefault();
$("#select2").val($(this).attr("class"));

var options = $("#select2 option");
var activeClass = $(this).attr("class");

options.each(function(i,e){

    var t = $(this);

    if(t.val() == activeClass){

        t.show();
    }else{
         t.hide();   
    }

})

});

---

我找不到任何带有选择选项的类？？你是什么意思？堆栈溢出不是一种代码编写服务。我们可以帮助您处理不起作用的代码，但您至少应该自己尝试解决这个问题。此外，您不能将

span

用作

ul

的直接子级。这是无效的HTML。这个问题本质上是一个添加了字符串的搜索，你问它之前用谷歌搜索过吗？你已经试过了。那么我们都会帮你解决这个问题。显示一些您尝试过的

JQuery

。此代码正在运行，但是如何删除与li不具有相同类的select选项上的其他值？谢谢again@labli在单选下拉列表中，一次只能选择一个值。因此，当您将某些值设置为选中时，其他值将自动取消删除。@raj，我想做的是类似于此的事情，根据li类的不同，只有选择框中选项的值会出现。。对不起，如果我不清楚，现在没有什么新的：P，我写了答案，40分钟前按了“提交”，然后离开了桌子。。。回来后，我看到一个提交错误。。我没有看到你的答案，所以更正后提交我的答案。所以，它贴在你的后面。。。我想我现在可以移除它了。。。因为这两个答案是相似的，所以在选择元素$（'#select2 option[value=“”+$（this）.val（）+“]”]）.prop（“selected”，true）.show（）时必须这样使用；

$("ul.north li a").click(function (e) {
e.preventDefault();
$("#select2").val($(this).attr("class"));

var options = $("#select2 option");
var activeClass = $(this).attr("class");

options.each(function(i,e){

    var t = $(this);

    if(t.val() == activeClass){

        t.show();
    }else{
         t.hide();   
    }

})

});