javascript - jquery(this)问题

Question

给一系列<li></li>添加了onclick属性执行<script></script>里的函数，可是this却未能成功指定。

目的是想要选择ARS这个字符串以作数据库查询用。

<li class="dropdown"><a href="" onclick="queryfx().call($(this));">ARS</a>
                <ul class="dropdown-menu">
                    <li><a href="">one</a></li>
                    <li><a href="">tow</a></li>
                    <li><a href="">three</a></li>
                </ul>
            </li>

个人分析需要用到call函数，可是并不成功。望前辈们解答。
另外这一部分知识应该看哪一部分来补充：（，谢！

Answer 1

如果li结构片很多，最佳实践还是事件委托
原生js不熟的话，就用jquery的delegate好了
比如

$(document).delegate(".dropdown > a","click",function(){/*what you want*/});

Answer 2

这个写法太丑陋了

这样写，query 这个函数是被 <a> 调用的, this指的时 <a>, call的时候， 还是被 jquery包装过的jq对象。

改进，直接给 <li> 添加事件函数，在通过js的dom操作获取a的ARS值，传入你的query事件函数里.

html 文件

<li class="dropdown" id="dropdown">
    <a href="">ARS</a>
    <ul class="dropdown-menu">            
      <li><a href="">one</a></li>
      <li><a href="">tow</a></li>
      <li><a href="">three</a></li>
    </ul>
</li>

js文件 大概写法

window.onload = function (){
    // 获取dom对象
    var oli = document.getElementById("dropdwon");
    var oars = oli.getElementsByTagName('a')[0];
    // 获取 a 标签内的值
    var avalue = oars.innerHTML;
    // 绑定事件
    oli.onclick = function(){
        query(avalue);
    }
}

function query(oars){
    do something;
}

去google一些文档，大概了解下 html css js 三者的关系和如何组织吧。

Answer 3

要注意，如果像你这样的话，当新添加一个<li>的时候，<li>是没有onclick事件的
百度下js的事件委托