1

jqueryとphpでお気に入りの追加/削除を作成しようとしています。addfavorite関数は機能しますが、リンクのid属性をaddfavoriteからremovefavoriteに変更すると機能しません。IDは変更されましたが、それでもaddfavorite関数を実行しています。firebugを開くと、id = "removefavorite"でIDが変更されていることがわかりますが、ページソースを開いても、ID='addfavorite'は変更されませんでした。

domでもリンクのIDをjqueryで変更できますか？

JQUERY:
$(document).ready(function() {
$('#addfavorite').click(function() {
    id = $('#item').attr('value');
    $.ajax({
        type: "POST",
        url: "http://127.0.1.1/zend/fm/public/video/addfavorite",
        data: "id_video="+id,
        cache: false,
        async: false,
        success: function(result) {
            $('#addfavorite').attr('id','removefavorite');
            $('#removefavorite').text('Remove from favorite');
        getRating(text);
        },
        error: function(result) {
            alert("some error occured, please try again later");
        }
    });
});

$('#removefavorite').click(function() {
    id = $('#item').attr('value');
    $.ajax({
        type: "POST",
        url: "http://127.0.1.1/zend/fm/public/video/removefavorite",
        data: "id_video="+id,
        cache: false,
        async: false,
        success: function(result) {
            $('#removefavorite').attr('id','removefavorite');
            $('#removefavorite').text('Remove from favorite');
        getRating(text);
        },
        error: function(result) {
            alert("some error occured, please try again later");
        }
    });
});
)};

HTML:
<a href="javascript:void(0)" id="addfavorite">
    Add to favorite
</a>
4

3 に答える 3

2

まず、ID 属性を使用するリンクをいくつ使用しますか? ID は1 つの要素だけのものであることに注意してください。トグル関数http://api.jquery.com/toggle-event/を使用してこれを行うことをお勧めします。

.live イベントの代わりに .click イベントを使用したため、コードが機能していないと思います。また、クリック イベントにバインドしたときに #removefavorite イベントが存在しません (#removefavorite であるため)。また、イベントは要素に割り当てられるため、要素は属性を変更してもイベントを保持できることに注意してください。トグルまたはライブ機能でそれを行いたくない場合は、他のイベントを割り当てる前に最初のクリック イベントのバインドを解除できます。

また、Firebug はその場で変更された DOM を表示するため、変更されたことがわかります。ソースの表示を行うと、ダウンロードした元の HTML ドキュメントが表示されます (javascript で変更する必要はありません)。

また、Firefox 用の FireQuery 拡張機能を使用することをお勧めします。これにより、その要素にバインドされたイベントが表示されます (jQuery で開発している場合は、その他の有用なデータの中でも特に)。

私の最初の投稿がお役に立てば幸いです:)

于 2011-12-29T12:46:07.157 に答える
1 
$('#addfavorite').toggle(function() {
     id = $('#item').attr('value');
     $.ajax({
        type: "POST",
        url: "http://127.0.1.1/zend/fm/public/video/addfavorite",
        data: "id_video="+id,
        cache: false,
        async: false,
        success: function(result) {
            $('#addfavorite').text('Remove from favorite');
            getRating(text);
        },
        error: function(result) {
            alert("some error occured, please try again later");
        }
     });
   }, function() {
     id = $('#item').attr('value');
     $.ajax({
        type: "POST",
        url: "http://127.0.1.1/zend/fm/public/video/removefavorite",
        data: "id_video="+id,
        cache: false,
        async: false,
        success: function(result) {
            $('#addfavorite').text('Remove from favorite');
            getRating(text);
        },
        error: function(result) {
            alert("some error occured, please try again later");
        }
     });
   });

要素を変更しないidでください。ラベルを変更するだけです。私はそれがあなたを助けると思います。

于 2011-12-29T12:58:44.137 に答える
0

わかりました。答えは、ドキュメントが にロードされた後にクリック関数をバインドすることです$(document).ready(function() { ... }。

実際、Ajax 呼び出しが正常に行われた場合は、リンクの ID を変更してください。これは機能するはずです。その中でエラーを見つけることはできません。問題は、トリガーを更新しないことです。そのため、要素の ID が変更されても、以前のトリガーは引き続きバインドされています。したがって、それを解決する方法は、トリガーをやり直してトリガーを更新することです$('#removefavorite').click(function() { ... } );

ただし、互いに1290383948回ネストできないため、別の関数を作成してください。;-)

JSFiddle で簡単に作成した例を次に示します 。

于 2011-12-29T12:47:22.103 に答える