如何从锚标签onclick函数调用jQuery(this)

时间:2013-09-23 10:42:53

标签: javascript jquery html

我有

 <ul>
            <li><a onclick="setSelectedTestPlan();" href="javascript:void(0);">New Test</a></li>
            <li><a onclick="setSelectedTestPlan();" href="javascript:void(0);">New Test fdgfdgfdgfdgfdgfdgfdgfdg fdg</a></li>
            <li><a onclick="setSelectedTestPlan();" href="javascript:void(0);">New Plan</a></li>
            <li><a onclick="setSelectedTestPlan();" href="javascript:void(0);">Test</a></li>
        </ul>

代码,并希望将类名添加到标签parrent标签li,即class="selected" bu jquery。 我使用了这个jquery代码

function setSelectedTestPlan() {
        jQuery("#tree ul li").each(function () {
            jQuery(this).removeClass("selected");
        });

        jQuery(this).closest('li').addClass("selected");
    }

但这一行jQuery(this).closest('li').addClass("selected");无效......

请帮帮我......

5 个答案:

答案 0 :(得分:19)

<强> HTML

<li><a onclick="setSelectedTestPlan(this);" href="javascript:void(0);">New Test</a></li>

<强> JS

function setSelectedTestPlan(el) {      
       jQuery("#tree ul li").removeClass("selected");
       jQuery(el).closest('li').addClass("selected");
    }

<强> JS

function setSelectedTestPlan(el) { 
   jQuery(el).closest('li').addClass("selected").siblings().removeClass("selected");
}

答案 1 :(得分:2)

你需要通过这个函数发送元素

<强> HTML

onclick="setSelectedTestPlan(this);"

<强> JS

function setSelectedTestPlan(ele) {      
       jQuery("#tree ul li").each(function () {
            jQuery(this).removeClass("selected");
        });

        jQuery(ele).closest('li').addClass("selected");
    }

答案 2 :(得分:2)

一行:

jQuery(this).closest('li').addClass("selected").siblings().removeClass("selected");

但你必须修改你的活动才能通过这个&#39;;

onclick="setSelectedTestPlan(this);"

答案 3 :(得分:1)

function setSelectedTestPlan(e) {
    jQuery("#tree ul li").each(function () {
        jQuery(this).removeClass("selected");
    });

    jQuery(e).closest('li').addClass("selected");
}

 <li><a onclick="setSelectedTestPlan(this);" href="javascript:void(0);">New Test</a></li>

<强>替代

    <ul>
        <li><a class="mylink" href="javascript:void(0);">New Test</a></li>
        <li><a class="mylink" href="javascript:void(0);">New Test fdgfdgfdgfdgfdgfdgfdgfdg fdg</a></li>
        <li><a class="mylink" href="javascript:void(0);">New Plan</a></li>
        <li><a class="mylink" href="javascript:void(0);">Test</a></li>
    </ul


$(function(){
$(".mylink").click(function(e){
     $(".mylink").parents("li").removeClass("selected");
     $(this).parents("li").addClass("selected");
     e.preventDefault();   
   });
 });

答案 4 :(得分:0)

HTML

<li><a onclick="setSelectedTestPlan.call(this, event);" href="javascript:void(0);">New Test</a></li>

JS

function setSelectedTestPlan(e) {
   jQuery(this)closest('li').addClass("selected").siblings().removeClass("selected");
}