Question

可能重复：
JavaScript not being called in inline event handler

尝试使用AJAX构建基于javascript的喜欢/不喜欢系统来执行操作。喜欢和不喜欢的功能被命名为“likeit”和“dislikeit”。

HTML：

<a class="btn" data-toggle="tooltip" title="I like this." id="like" onclick="likeit('abc123');"><i class="icon-thumbs-up"></i></a>
<a class="btn" data-toggle="tooltip" title="I didn't like this." id="dislike" onclick="dislikeit('abc123');"><i class="icon-thumbs-down"></i></a>

JS：

$(document).ready(function() {
    "use strict";
    (function likeit(id) {
        $.post("likeDislike.php", {likeID:id}, function(data) {
            alert(data);
            // Nothing to be displayed.
        });
    });
    (function dislikeit(id) {
    });
});

我在Google Chrome的Inspect Element中遇到的错误是：

Uncaught ReferenceError: likeit is not defined
Uncaught ReferenceError: dislikeit is not defined

然而，它们就在那里定义。

Answer 1

您的onclick=".."内容（无论如何都不应该使用）只能访问全局范围。您的函数在document.ready回调函数的范围内定义。

正确的解决方案是使用JavaScript而不是内联事件注册处理程序。

$(document).ready(function() {
    "use strict";

    function likeit(id) { ... }
    function dislikeit(id) { ... }

    var funcMap = {
        'like': likeit,
        'dislike': dislikeit
    };

    $('.btn').on('click', function(e) {
        e.preventDefault();
        var action = $(this).data('action');
        var id = $(this).data('id');
        var func = funcMap[action];
        if(func) {
            func.call(this, id);
        }
    })
});

您的HTML也需要进行一些修改：

<a class="btn" data-toggle="tooltip" title="I like this." id="like" data-id="abc123" data-action="like"><i class="icon-thumbs-up"></i></a>
<a class="btn" data-toggle="tooltip" title="I didn't like this." id="dislike" data-id="abc123" data-action="dislike"><i class="icon-thumbs-down"></i></a>

Answer 2

试试这个

//make sure jquery library loaded here

<a class="btn" data-toggle="tooltip" title="I like this." id="like" onclick="likeit('abc123');"><i class="icon-thumbs-up"></i></a>
<a class="btn" data-toggle="tooltip" title="I didn't like this." id="dislike" onclick="dislikeit('abc123');"><i class="icon-thumbs-down"></i></a>

<script type="text/javascript">
function likeit(id){
$.post("likeDislike.php", {likeID:id}, function(data) {
            alert(data);
            // Nothing to be displayed.
        });

}
function dislikeit(id) {
    }
</script>

未定义内联函数

2 个答案: