提问人:WEBGONDEL UG 提问时间:10/30/2016 最后编辑:Artur FilipiakWEBGONDEL UG 更新时间:10/31/2016 访问量:402
包含引号和点的 .append() 内容的问题
Problems with .append() content containing quotes and dots
问:
我想使用 ..append(SOMET HTML CODE)
进入我的我想实现一个事件 - 它调用一个函数 - 但是引号和内容本身似乎存在一些问题(因为内容是足球运动员的名字,而这个名字包含一个点,例如:M**。
<tr>
onclick()
)
我的jQuery如下所示:
$('.player_table').append('<tr id="'+pos+players.id+'" costsForThisPlayer="12.2" class="goalKepperRow" onclick="addGoalkeeperByClickEvent("'+players.name+'", "gk1", 12.2)><td>something</td></tr>');
然后我的 HTML 看起来真的很奇怪
<tr id="gk149" costsforthisplayer="12.2" class="goalKepperRow" onclick="addGoalkeeperByClickEvent(" m.hitz",="" "gk1",="" 12.2)=""><td>something</td></tr>
这是崩溃的部分:
onclick="addGoalkeeperByClickEvent(" m.hitz",="" "gk1",="" 12.2)="">
我必须如何正确更改我的jquery部分?
答:
4赞
Artur Filipiak
10/30/2016
#1
HTML 字符串在双引号内包含双引号。 您使用了单引号并转义了它们:
'... onclick="addGoalkeeperByClickEvent(\''+players.name+'\', \'gk1\', 12.2)"...'
// or:
'... onclick=\'addGoalkeeperByClickEvent("'+players.name+'", "gk1", 12.2);\'...'
附带说明:
costsForThisPlayer
不是有效的 HTML 属性。使用data-*
属性存储自定义值。使用属性不是好做法。您应该考虑使用 jQuery 设置事件处理程序。
onClick
.click()
由于您的内容是动态添加的,因此您必须使用
.on()
在表上委托事件:click
$('.player_table').on('click', `.goalKepperRow`, function(){ var costsForThisPlayer = $(this).attr('data-costsForThisPlayer'); var playerName = $(this).attr('data-name'); var something = $(this).attr('data-something'); // all the values that you're passing to the onClick function are here // ... the rest of your addGoalkeeperByClickEvent() method ... });
那么你的 HTML 创建部分将是:
$('<tr/>').attr({ 'id' : pos+players.id, 'class' : "goalKepperRow", 'data-costsForThisPlayer' : "12.2", 'data-name' : players.name, 'data-something' : "gk1" }) .append('<td>something</td>') .appendTo('.player_table');
评论
0赞
Tân
10/30/2016
我建议使用语法“text ${string}”以便于阅读。
0赞
WEBGONDEL UG
10/30/2016
谢谢你的帮助,谢谢你的额外旁注,但是我想调用的函数是基于数据库中的值,这就是为什么我在 HTML 部分尝试使用 onClick() 的原因......(我希望我描述得足够好,呵呵)
0赞
Artur Filipiak
10/30/2016
@nbg15,那么为什么不使用属性来存储每个元素的数据库值呢?data-*
评论