简体   繁体   English

onclick不调用JS函数(在任何浏览器上)

[英]onclick not calling JS function (on any browser)

Example: 例:

<button id="banButton{$id}"onclick="deletePhoto({$id}, {$picture_path});">BAN {$id}</button>

And before the </body> tag: </body>标记之前:

<script type="text/javascript" src="../profile/theme/js/jquery.js"></script>

<script type="text/javascript">

function deletePhoto(id, pic_path) {
    alert("test");
    $.post("ajax.php", { toid: toid, pic_path: pic_path });
}

$(document).ready(function() {
    alert("test2");

});


</script>

The rendered HTML could look like: 呈现的HTML可能类似于:

<button id="banButton508" onclick="deletePhoto(508, profile_photos/686733/1_4044.jpg);">BAN 508</button> <img src="../profile/pics/686725/2_3234.jpg" width="150" height="150"/>

The "test2" alert shows up when loading the page, but when clicking on the button, the function doesn't run (alert doesn't even show up). 加载页面时显示“ test2”警报,但是单击按钮时,该功能无法运行(甚至不会显示警报)。

Any idea why? 知道为什么吗?

Edit: I've now wrapped the picture_path in quotes, like 编辑:我现在将picture_path括在引号中,例如

<button id="banButton{$id}" class="banButton" onclick="deletePhoto({$id}, "{$picture_path}");">BAN {$id}</button>

still not working with this. 仍然不能与此一起工作。

看起来picture_path是一个字符串文字,如果id值也是一个字符串,也将其括在''然后也这样做

<button id="banButton{$id}" onclick="deletePhoto('{$id}', '{$picture_path}');">BAN {$id}</button>

try placing your function inside the document ready function along with everything else. 尝试将您的函数与其他所有函数一起放在文档就绪函数中。

$(document).ready(function(){
function deletePhoto(id, pic_path) {
    alert("test");
    $.post("ajax.php", { toid: toid, pic_path: pic_path });
}
});

Following code is working fine 以下代码工作正常

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 <title>Test</title>
  </head>

<body>

<button id="banButton508" onclick="deletePhoto(508, 'profile_photos/686733/1_4044.jpg');">BAN 508</button> <img src="../profile/pics/686725/2_3234.jpg" width="150" height="150"/>

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js "></script>

<script type="text/javascript">

function deletePhoto(id, pic_path) {
alert("test"+pic_path);
$.post("ajax.php", { toid: toid, pic_path: pic_path });
}

$(document).ready(function() {
  alert("test2");

});


</script>
 </body>

If you're using jquery then why should not manipulating dom-aciton in standard form. 如果您使用的是jQuery,那么为什么不应该以标准形式来操纵dom-aciton。

like 喜欢

<button id="banButton{id}" data-id="{id}" data-image_url="{$picture_path}">BAN {id}</button>

and the javascript 和JavaScript

function deletePhoto(id, pic_path) {
    alert("test");
    $.post("ajax.php", { toid: toid, pic_path: pic_path });
}

$(document).ready(function() {
    alert("test2");

    $("button[id^='banButton']").click(function(){
        var id = $(this).data('id');
        var img_url = $(this).data('image_url');

        deletePhoto(id, img_url);
    });

});

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM