我的 html 页面上有一个用 php 生成的按钮:
<button type="button" id="KREDI-CEKIM-TALEP-SIL-BUTTON-cYSDLtvqnA6U0z600fPJ4crsIwLLZGrJmLpRW/t/j2NUJH4E0S0+3a4U7xQZFsDQ7+PoFzBahrekLFFS4lsyJw==" class="btn btn-labeled btn-danger" data-loading-text="iptal ediliyor..."><span class="btn-label"><i class="glyphicon glyphicon-remove"></i></span>İptal Et</button>
<script>$('#KREDI-CEKIM-TALEP-SIL-BUTTON-cYSDLtvqnA6U0z600fPJ4crsIwLLZGrJmLpRW/t/j2NUJH4E0S0+3a4U7xQZFsDQ7+PoFzBahrekLFFS4lsyJw==').on('click',function(event){alert(1);KrediCekimTalepSilFunc('cYSDLtvqnA6U0z600fPJ4crsIwLLZGrJmLpRW/t/j2NUJH4E0S0+3a4U7xQZFsDQ7+PoFzBahrekLFFS4lsyJw==');});</script>
我正在编写一个 onclick 事件,但它生成以下错误消息:
Uncaught Error: Syntax error, unrecognized expression:
#KREDI-CEKIM-TALEP-SIL-BUTTON-cYSDLtvqnA6U0z600fPJ4crsIwLLZGrJmLpRW/t/j2NUJH4E0S0+3a4U7xQZFsDQ7+PoFzBahrekLFFS4lsyJw==
页面加载时出现错误,不是点击时出现的。
最佳答案
这不是 jQuery,而是 CSS selector syntax这就是问题所在(因为 jQuery 使用 CSS 选择器)。 id
值包含您 can't use directly in a CSS id
selector 的字符。您可以转义这些字符,或使用 getElementById
:
$(document.getElementById('KREDI-CEKIM-TALEP-SIL-BUTTON-cYSDLtvqnA6U0z600fPJ4crsIwLLZGrJmLpRW/t/j2NUJH4E0S0+3a4U7xQZFsDQ7+PoFzBahrekLFFS4lsyJw==')).on('click', function(event){
alert(1);
KrediCekimTalepSilFunc('cYSDLtvqnA6U0z600fPJ4crsIwLLZGrJmLpRW/t/j2NUJH4E0S0+3a4U7xQZFsDQ7+PoFzBahrekLFFS4lsyJw==');
});
getElementById
不使用 CSS 选择器,因此 CSS 选择器语法不会出现在其中。
但使用符合 CSS 规则的 id
可能会更好。您在评论中说过:
This id is generated based on a string included in database. I must hide it from user. When user clicks this button ajax post executes and sending this id. PHP page is decodes it again.
在这种情况下,我会使用 data-*
属性,如下所示:
<button type="button" id="my-button" data-key="cYSDLtvqnA6U0z600fPJ4crsIwLLZGrJmLpRW/t/j2NUJH4E0S0+3a4U7xQZFsDQ7+PoFzBahrekLFFS4lsyJw==" class="btn btn-labeled btn-danger" data-loading-text="iptal ediliyor..."><span class="btn-label"><i class="glyphicon glyphicon-remove"></i></span>İptal Et</button>
然后
$("#my-button").on('click', function(event){
alert(1);
KrediCekimTalepSilFunc($(this).attr("data-key"));
});
请注意我如何从 data-key
属性获取要传递给 KrediCekimTalepSilFunc
的值,这样就不必重复该值。如果您有其中几个,您可以在按钮上使用一个类,甚至可能是一个委托(delegate)选择器:
$("selector-for-container").on('click', '.delete-button', function(event){
alert(1);
KrediCekimTalepSilFunc($(this).attr("data-key"));
});
关于JQuery 标识符名称限制,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26525357/