0

这段代码不知何故不起作用,我不知道为什么,我不擅长 php 也不擅长 js,只是想建立一些网站。

不工作的部分是这个最喜欢的按钮,它就像它必须工作一样工作,但点击后它不会切换到“不喜欢”,它只有在你刷新浏览器时才会工作。

这是由 php 文件生成的 html:

<a class="btn" id="fav28" title="Add to Favorites" href="javascript:;" onclick="AddFav('28','fav','add')">
    <i class="icon-heart"></i>
</a>

这是js函数:

function AddFav(id, dothis, dowhat) {

$.ajax({
    url: ("/process.php?do="+dothis+"&id="+id+"&action="+dowhat)
});
if(dowhat == "add"){
    document.getElementById(dothis+id).className = 'disabled';
    document.getElementById(dothis+id).onclick = another_function
    document.getElementById(dothis+id).title = 'Remove from Favorites';
}else if(dowhat == "remove"){
    document.getElementById(dothis+id).className = 'btn';
    document.getElementById(dothis+id).title = 'Add to Favorites';
}
}

我试过了

document.getElementById(dothis+id).onClick = "AddFav(28,id,remove)";

但这没有任何反应,它根本不会改变 onclick

它所要做的是将“onclick”事件从

onclick="AddFav('28','fav','add')"

onclick="AddFav('28','fav','remove')"

提前致谢。

4

4 回答 4

2

我可能错了,但我认为您不能用 JavaScript 覆盖 HTML 中的“onclick”属性。“onclick”将始终运行,即使您尝试更改它或在 JavaScript 中添加另一个点击处理程序。

这个问题的最佳解决方案是删除“onclick”属性,并使用 JavaScript 设置点击处理程序。

你的 PHP 应该生成这个:

<a class="btn" id="fav28" title="Add to Favorites" href="javascript:;">
    <i class="icon-heart"></i>
</a>

请注意,“onclick”已被删除。在你的 JS 中你应该有这样的东西:

var favButton = document.getElementById('fav28');

favButton.addEventListener( 'click', function(){
    // Note: `this` is referring to the button you clicked
    if( this.className === 'disabled' ) {

        // Run AddFav as if you were removing the favourite

        this.className = 'btn';
        this.title = 'Add to Favourites';

    } else {

        // Run AddFav as if you were adding the favourite

        this.className = 'disabled'
        this.title = 'Remove from Favourites';

    }

});

然后您的AddFav方法只需要担心添加或删除收藏夹,在您的情况下看起来它只是一个 Ajax 调用。您可以从更改按钮中删除所有逻辑AddFav,并在我注释掉的地方调用它。

于 2013-10-29T19:42:21.640 回答
1

这可能是范围问题:该AddFav函数可能未在全局范围内定义。

尝试更换

function AddFav(id, dothis, dowhat) {

window.AddFav = function(id, dothis, dowhat) {

这样,您的AddFav函数是全局的,您可以使用window.AddFav或简单地调用它AddFav

于 2013-10-29T19:41:57.233 回答
1

你说你试过

document.getElementById(dothis+id).onClick = "AddFav(28,id,remove)";

但语法是错误的,因为你没有 qoutesidremove(即字符串),例如:

AddFav(28,'id','remove')";

我看到您使用 jquery .. 如果您使用 jquery 为什么不享受所有功能。你的功能可以变成:

function AddFav(id, dothis, dowhat) {

$.ajax({
    url: ("/process.php?do="+dothis+"&id="+id+"&action="+dowhat)
});
if(dowhat == "add"){

    $('#' + dothis + id).addClass('disabled'); // add class disabled
    $('#' + dothis + id).removeClass('btn'); // remove class btn if exist

    $('#' + dothis  +id).on( "click", function() {
         AddFav(id,'fav','remove'); // attach new function AddFav for click event
    });

    $('#' + dothis  +id).attr('title','Remove from Favorites');

}
else if(dowhat == "remove"){

    $('#' + dothis + id).addClass('btn'); // add class btn
    $('#' + dothis + id).removeClass('disabled'); // remove class btn if exists

    $('#' + dothis  +id).attr('title','Add to Favorites');

}
}
于 2013-10-29T19:35:29.220 回答
1

如果您想在纯 javascript 中执行此操作,则将 onclick 属性更改为另一个函数,如下所示:

document.getElementById(dothis+id).onclick = function { AddFav(id,'fav','remove') };

像这样:

http://jsfiddle.net/4ku75/

于 2013-10-29T19:37:29.057 回答