首页 > 解决方案 > onClick、变量和字符串

问题描述

当用户单击链接时,我试图调用一个函数。

$('#'+fieldId).append('<div class="div-table-td-artists"><a href="#" onclick=addArtistToSpreadsheet("'+similarArtist+'")>'+similarArtist+'</a></div>');

未捕获的 SyntaxError:无效或意外的令牌

$('#'+fieldId).append('<div class="div-table-td-artists"><a href="#" onclick=addArtistToSpreadsheet(\""'+similarArtist+'\"")>'+similarArtist+'</a></div>');

Uncaught SyntaxError: missing ) 在参数列表之后

我不明白发生了什么事。 similarArtist是一个字符串(我什至尝试将 .toString() 添加到它以确保)。

下面的版本确实有效。

$('#'+fieldId).append('<div class="div-table-td-artists"><a href="#" onclick=addArtistToSpreadsheet("dummy test")>'+similarArtist+'</a></div>');

谢谢你的帮助。

标签: javascriptstringonclick

解决方案


您需要转义引号,例如$('#'+fieldId).append('<div class="div-table-td-artists"><a href="#" onclick="addArtistToSpreadsheet(\''+similarArtist+'\')">'+similarArtist+'</a></div>');

或者更好地使用模板文字

const fieldId = 'testid'
let similarArtist = 'Some artist'
let similarArtist2 = 'Some artist2'

// Working example
$('#'+fieldId).append('<div class="div-table-td-artists"><a href="#" onclick="addArtistToSpreadsheet(\''+similarArtist+'\')">'+similarArtist+'</a></div>');


// Better way template literals
$('#'+fieldId).append(
`
<div class="div-table-td-artists">
    <a href="#" onclick="addArtistToSpreadsheet('${similarArtist2}')">${similarArtist2}</a>
</div>
`
);

function addArtistToSpreadsheet(artist){
  console.log(artist)
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="testid"></div>


推荐阅读