Question

我试图通过onclick执行一个函数，但是附加的链接不包含正确的引号并且添加了随机符号。

$('#ip_list').append("<li><a onclick='setIP('" +  ip + "')'>" + ip + "<span class='glyphicon glyphicon-plus pull-right'></span></a></li>");

Chrome Tools中的结果如下：

<a onclick="setIP(" 192.168.1.129')'="">192.168.1.129<span class="glyphicon glyphicon-plus pull-right"></span></a>

双引号来自哪里我只是在IP地址周围使用单引号？

Answer 1

您不能在onclick属性中使用相同类型的引号来分隔属性值，因为它们会终止该属性。如果在属性周围使用双引号，请在内部使用单引号，反之亦然：

$('#ip_list').append("<li><a onclick='setIP(\"" +  ip + "\")'>" + ip + "<span class='glyphicon glyphicon-plus pull-right'></span></a></li>");

更好的解决方案是使用jQuery在一个地方绑定点击处理程序，而不是内联Javascript：

$("#ip_list").on("click", "li a", function() {
    setIP($(this).text());
});

Answer 2

试试这个

$('#ip_list').append("<li><a onclick=setIP('" +  ip + "')>" + ip + "<span class='glyphicon glyphicon-plus pull-right'></span></a></li>");

https://jsfiddle.net/fh1gt4tz/

或以这种方式

$('#ip_list').append("<li><a onclick=\"setIP('" +  ip + "')\">" + ip + "<span class='glyphicon glyphicon-plus pull-right'></span></a></li>");

https://jsfiddle.net/oqt00d4z/

Answer 3

从'移除setIP('"，因为属性引号''与函数append("")

中的引号不匹配

$('#ip_list').append('<li><a onclick="setIP(\'' + ip + '\')">' + ip + '<span class="glyphicon glyphicon-plus pull-right"></span></a></li>');

或者TrueBlueAussie建议使用""作为属性，但无论如何浏览器本身都会转换它们。

输出：

<a onclick="setIP('188.87.76.21')">188.87.76.21<span class="glyphicon glyphicon-plus pull-right"></span></a>

Answer 4

这是因为您的引号（标记属性的开头和结尾）与您的引号冲突，以在属性中标记

。

解决此问题的最简单方法是：

$('#ip_list').append("<li><a onclick=\"setIP('" + ip + "')\">" + ip + "<span class='glyphicon glyphicon-plus pull-right'></span></a></li>");

...使用"标记属性的开头和结尾，使用'标记JavaScript字符串文字。注意我们必须使用\来转义用于属性的"（因为也用于表示传递给的整个字符串append()）。你会发现这个有用; http://jsfiddle.net/1yott86L/

Answer 5

很奇怪，但所有那些双引号和单引号飞来飞去看起来有点乱。

有助于将代码重写为此以避免混淆

$('<li>').append(
    $('<a>', { onclick: 'setIP(' +  ip + ')', text: ip})
).appendTo($('#ip_list'));

更容易阅读，没有'引号内的引号'，你可以看到发生了什么。

Answer 6

@R Lam的建议起到了小提琴的作用。如果你真的需要在函数名称周围编写引号，如onclick="setIP('xxx.xxx.xxx.xxx')"，那么你应该编写如下代码：

$('#ip_list').
    append("<li><a onclick=\"setIP('" +  ip + "')\">" + ip + 
    "<span class='glyphicon glyphicon-plus pull-right'></span></a></li>");

在使用jQuery附加时，行情不会像他们应该的那样

6 个答案: