使用jquery点击处理锚点onClick() [英] Use jquery click to handle anchor onClick()

查看:153
本文介绍了使用jquery点击处理锚点onClick()的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在for循环中有一组动态生成的锚标记,如下所示:

I have a set of dynamically generated anchor tags in a for loop as follows:

<div id = "solTitle"> <a href = "#"  id = "' + tagId + '" onClick = "openSolution();"> ' + solTitle + '</a></div> <br>';

一旦执行此代码,其中一个案例的html输出将如下所示:

Once this code is executed the html output for one of the case would look like:

<div id = "solTitle"> <a href = "#"  id = "solution0" onClick = "openSolution();">Solution0 </a></div> <br>

<div id = "solTitle"> <a href = "#"  id = "solution1" onClick = "openSolution();">Solution1 </a></div> <br>

现在我想点击上面的链接显示不同的文字。
openSolution()如下所示:

Now I want different texts to be displayed on clicking the above links. openSolution() looks like this:

function openSolution() {
    alert('here');
    $('#solTitle a').click(function(evt) {
        evt.preventDefault();
        alert('here in');
        var divId = 'summary' + $(this).attr('id');

        document.getElementById(divId).className = '';

    });
}

当我执行它并点击任一链接,里面的jquery点击处理程序。我检查它上面的警报使用。它只显示警报 - 这里,而不是警报 - 这里。
第二次点击链接时,一切都与divId的正确值完全一致。

When I execute it and click on either of the links, the flow doesnot come inside the jquery click handler. I checked it by the above alerts used. It only displays the alert - 'here' and not the alert - 'here in'. On clicking the link second time, everything works perfectly with correct value of divId.

推荐答案

链接,执行 openSolution 函数。该函数将点击事件处理程序绑定到链接,但它不会执行它。第二次单击链接时,将会执行单击事件处理程序。

The first time you click the link, the openSolution function is executed. That function binds the click event handler to the link, but it won't execute it. The second time you click the link, the click event handler will be executed.

种种失败的地方,首先使用jQuery。为什么不只是将点击事件绑定到第一个元素:

What you are doing seems to kind of defeat the point of using jQuery in the first place. Why not just bind the click event to the elements in the first place:

$(document).ready(function() {
    $("#solTitle a").click(function() {
        //Do stuff when clicked
    });
});

这样你不需要 onClick 属性。

它也看起来像你有多个元素具有相同的 id 值(solTitle ),这是无效的。您需要找到一些其他常见的特性( class 通常是一个不错的选择)。如果将 id =solTitle的所有出现更改为 class =solTitle,则可以使用类selector:

It also looks like you have multiple elements with the same id value ("solTitle"), which is invalid. You would need to find some other common characteristic (class is usually a good option). If you change all occurrences of id="solTitle" to class="solTitle", you can then use a class selector:

$(".solTitle a")

由于重复的 id 值无效,当面对同一个<$ c的多个副本时,代码将无法正常工作$ c> id 。趋向于发生的是,使用 id 的元素的第一次出现,并且忽略所有其他元素。

Since duplicate id values is invalid, the code will not work as expected when facing multiple copies of the same id. What tends to happen is that the first occurrence of the element with that id is used, and all others are ignored.

这篇关于使用jquery点击处理锚点onClick()的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆