Question

您好我正在尝试使用jquery和ul li菜单制作我自定义的组合框。因此，当鼠标单击li元素时，我必须读取其值并将其父级设置为单击的元素值等。基本选择方法。

那么我怎么能读取点击的li元素值并将该值设置为它的父元素。在这里我的结构。

  <ul class="topnav">
            <li><a href="#">Home</a></li>
            <li><a href="#">All Abilities</a>
                <ul class="subnav">
                    <li><a href="#">Fire Master</a></li>
                    <li><a href="#">Great Attack</a></li>
                    <li><a href="#">Manyak Ability</a></li>
                    <li><a href="#">Super Ability</a></li>
                    <li><a href="#">Deneme Ability</a></li>
                </ul>
            </li>
        </ul>

这里是jquery代码

        $(document).ready(function () {

        $("ul.subnav").parent().append("<span></span>"); //Only shows drop down trigger when js is enabled - Adds empty span tag after ul.subnav

        $("ul.topnav li").click(function () { //When trigger is clicked...

            //Following events are applied to the subnav itself (moving subnav up and down)
            $(this).find("ul.subnav").slideDown('fast').show(); //Drop down the subnav on click

            $(this).hover(function () {
            }, function () {
                $(this).find("ul.subnav").slideUp('slow'); //When the mouse hovers out of the subnav, move it back up
            });

            //Following events are applied to the trigger (Hover events for the trigger)
        }).hover(function () {
            $(this).addClass("subhover"); //On hover over, add class "subhover"
        }, function () {    //On Hover Out
            $(this).removeClass("subhover"); //On hover out, remove class "subhover"
        });


        $("ul.topnav li ul.subnav li a").click(function () { //When trigger is clicked...

            //****************** none of these working*************************//
            var srVal1 = $(this).find("ul.subnav").val();
            var srVal2 = $(this).find("subnav").val();
            var srVal3 = $(this).find("li a").val();
            var srVal4 = $(this).find("a").val();
            var srVal5 = $(this).parent("li").val();
            var srVal5 = $(this).find("li").val();
            var srVal6 = $(this).val();
            var srVal7 = $(this).parent("li a").val();

        });
    });

Answer 1

您希望$(this).text()，.val()用于表单元素。

这是ya的jsfiddle：http://jsfiddle.net/JbRqM/1/

注意我使用.parents('li')来选择嵌套ul的父<li>标记：

$(this).parents('li').html($(this).text());

Answer 2

$('ul.topnav li ul.subnav li a').click(function(){

    $(this).parents('ul.subnav').siblings('a').html($(this).text());

});

Answer 3

使用$(this).parents("li")代替$(this).parent("li")

.parent("li")仅查看元素的直接父级，即<ul>

.parents("li")查看所有父集合。更具体地说，使用.parents("li:first")

Jquery如何读取单击哪个li元素

3 个答案: