使用锚标记调用 jquery 函数

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/17489802/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 19:11:57  来源:igfitidea点击:

calling jquery function with anchor tag

jquery

提问by Arianule

I want to call a Jquery function with a hyperlink.

我想用超链接调用 Jquery 函数。

As I have it at the moment it is like this.

就像我现在拥有的那样。

<a name='lnkViews'>" + title+ "</a>

$("a[name='lnkViews']").on("click", function (e) {
    alert("Calling function");
});

As it is here it is not working. How can I call the function with the Hyperlink?

因为它在这里它不起作用。如何使用超链接调用函数?

回答by A. Wolff

Use delegationversion of .on()for dynamic created element:

动态创建的元素使用委托版本:.on()

WORKING EXAMPLE

工作实例

$(document).on("click","a[name='lnkViews']", function (e) {
    alert("Calling function");
});

回答by SpYk3HH

Either Prevent Default Behavioror use the javascript:void(0)trick.

要么防止默认行为,要么使用javascript:void(0)技巧。

$(function() {  //  simply document onload call, just pointing out where to put code, if you didn't already know
    $(document).on('click', 'a[name=lnkViews]', function(e) {
        e.preventDefault();
    });
})

| OR |

| 或 |

<a name="lnkViews" href="javascript:void(0);">" + title+ "</a>

then, in your JS

然后,在你的 JS 中

$(function() {
    $(document).on('click', 'a[name=lnkViews]', function(e) {
        /* do work */
    });
})


I noticed in your comments you said the link is created dynamically, then my solution will work for you based on the fact I'm using the delegateversion of .on. What this means, is the event is assigned to anything added to the document that matches the selector. thus the reason for the assignment the way it is:

我在自己的评论注意到你说的是创建的链接dynamically,然后我的解决方案会为你根据我使用的事实工作delegate的版本.on。这意味着,事件被分配给添加到与选择器匹配的文档的任何内容。因此,分配的原因是这样的:

$(document).on('click', 'a[name=lnkViews]', function(e) {

回答by webrama.pl

Which version of jquery do you use?

你用的是哪个版本的jquery?

Put it into:

把它放入:

$(function()
{
   js code
});

You've probably omitted it, but maybe it's not the thing because it looks you're adding link dynamically.

您可能已经省略了它,但也许不是,因为看起来您正在动态添加链接。

If so, try:

如果是这样,请尝试:

 var link = "<a href='#' onclick='alert(\'Calling function\');'>" + title + "</a>";

回答by Julien Sanchez

You have to make sure that your a link is in the DOM when your on('click')code is executed.

当你的on('click')代码被执行时,你必须确保你的链接在 DOM 中。

The jQuery function on()will attach an event handler to all jQuery object contained in $("a[name='lnkViews']")but if there is no element matching "a[name='lnkViews']"in your DOM when $("a[name='lnkViews']").on()is executed no handler will be attached.

jQuery 函数on()会将事件处理程序附加到其中包含的所有 jQuery 对象,$("a[name='lnkViews']")但如果"a[name='lnkViews']"$("a[name='lnkViews']").on()执行时您的 DOM 中没有匹配的元素,则不会附加任何处理程序。

To fix this you could do :

要解决此问题,您可以执行以下操作:

var $a = $('<a name="lnkViews">' + title+ '</a>');
$a.on("click", function (e) { });

//adding $a in your DOM with element.append($a); for exemple

You could also wait that your page is loaded before executing $("a[name='lnkViews']").on()by doing this :

您还可以$("a[name='lnkViews']").on()通过执行以下操作等待页面加载完毕后再执行:

$(function() {
    $("a[name='lnkViews']").on("click", function (e) { });
});

Regards

问候

回答by Zaheer Ahmed

It is working fine. Your code should contains });for closing jquery function:

它工作正常。您的代码应包含});用于关闭 jquery 函数:

Working Demo jsfiddle

工作演示 jsfiddle

$("a[name=lnkViews]").on("click", function () {
    alert("Calling function");
});

回答by Matthieu M

You can considere the following example : jquery sample

您可以考虑以下示例: jquery 示例

example

例子

<!DOCTYPE html>
<html>
<head>
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
  <a id="aLink">First Paragraph</a>
<script>
    $("#aLink").click(function () {
     alert("Calling function");
    });
</script>

</body>
</html>