2

何が間違っているのかわかりませんが、過去 2 時間、prop を使用してボタンの 2 つの項目の値を変更しようとしました。一方では機能しますが、他方では機能しません。その理由はわかりません。

html:

<input type='button' value='Following' id='btnFollow' dataaction="UnFollow" datatype='topic'>

jquery:

    $("#btnFollow").prop("value", "Follow");
    $("#btnFollow").prop("dataaction", "Follow");

最初の項目は変更されますが ( value)、2 番目の項目は変更されません ( dataaction)。理由はわかりません（それ以外の場合は、手遅れで、脳が反抗している可能性があります）。ドキュメントによると、私はそれを正しくやっています。1つが失敗した場合に備えて、各コマンドの間にアラートを追加しましたが、両方のアラートがオフになり、2番目の項目を変更しようとしたときにjqueryがクラッシュしたり、何かが発生したりしませんでした。スペルミスは見られず、コマンドをデイジーチェーン接続しようとしましたが、それでもうまくいきません。

助言がありますか？

全体コード:

$(document).ready(function () {
    $('#btnFollow').click(function() {
        var topic_id = $(this).attr('datatopic');
        var action_type = $(this).attr('datatype');
        var action_type_action = $(this).attr('dataaction');
        alert(action_type_action);
        //$("#btnFollow").prop('value', 'Following');
        if (action_type_action == 'Follow') {
            $("#btnFollow").prop({'value': 'Following', 'dataaction': 'UnFollow'});
            //$("#btnFollow").prop("value", "Following");
            //$("#btnFollow").prop("dataaction", "UnFollow");
                 $.ajax({
                type: 'POST',
                url: '/follow_modification',
                async: false,
                data: {
                    topic: topic_id,
                    action: action_type_action,
                    follow_type: action_type
                }
                //complete: function(xmlRequestObject, successString){
                //    ymmReceiveAjaxResponse(xmlRequestObject, successString);
                //}
            });

        } else if (action_type_action == 'UnFollow') {
            $("#btnFollow").prop({'value': 'Follow', 'dataaction': 'Follow'});
            //$("#btnFollow").prop("value", "Follow");
            //$("#btnFollow").prop("dataaction", "Follow");
            $.ajax({
                type: 'POST',
                url: '/follow_modification',
                async: false,
                data: {
                    topic: topic_id,
                    action: action_type_action,
                    follow_type: action_type
                }
                //complete: function(xmlRequestObject, successString){
                //    ymmReceiveAjaxResponse(xmlRequestObject, successString);
                //}
            });
        }
    })

});
4

3 に答える 3

8

コードは問題なく動作します: http://jsfiddle.net/zerkms/Capvk/

プロパティは通常、シリアライズされた HTML 属性を変更することなく、DOM 要素の動的状態に影響を与えます。

http://api.jquery.com/prop/

そのため、html では変更されていませんが、代わりに DOM で変更されています。HTMLでも変更したい場合は、使用してください.attr()

PS: @ahren がコメントで述べたように - おそらく使用するのが理にかなって.data()おり、data-xxxプロパティ

PPS: を使用して値を設定する場合-それぞれ.prop()で取得する必要があります.prop()

于 2012-07-24T04:46:54.107 に答える
1

単一の jQuery メソッドで複数のプロパティを設定する必要がある場合は、.propこれを試してください。

代わりは

$("#btnFollow").prop("value", "Follow");
$("#btnFollow").prop("dataaction", "Follow");

使用する

$("#btnFollow").prop({"value": "Follow", "dataaction": "Follow"});
于 2020-09-16T12:43:22.183 に答える
-1

.attrjQueryメソッドをご利用ください。

enter code hereこのデータ属性にアクセスするための新しい jQuery メソッドがあるデータアクションとして、html5 データ属性を適切に使用してください$('#btnFollow').data('action')。詳細については、次を参照してください。

于 2012-07-24T04:50:10.627 に答える