2

ユーザーがハイパーリンクをクリックすることを許可されていない場合、jQuery を使用してハイパーリンクを無効にしています。

ドキュメント（http://api.jquery.com/attr/）には次のように書かれています：

フォーム要素の 、 、状態などの DOM プロパティを取得および変更するには、checkedメソッドselectedを使用します。disabled.prop()

フォーム要素は<input ...>要素なので、リンクではないと思います ( <a>)

.prop('disabled', true)そして、それがうまくいかない理由ですが、.attr('disabled', 'disabled')うまくいきます。しかし、それはうまくいくはずですか？リンクを無効にできるという仕様はありますか? その場合、リンクをクリックしても何のアクションもありませんか? - それとも、ブラウザが優れているために実装するブラウザが少ないだけですか?

実際にリンクにあることが意図されていない場合disabled、ユーザーがリンクをクリックすることを禁止する簡単な方法は他にありますか、hrefそれとも属性を削除して再添付する必要がありますか?

4

2 に答える 2

4

MDNの仕様によると、許可されている属性はありませんdisabled。

ユーザーがリンクをクリックできないようにしたい場合は、いくつかの方法でそれを行うことができます。

$('a').on('click', function(event){
    event.preventDefault(); //prevent the default behaviour of the Link (e.g. redirecting to another page)
});

または

$('a').removeAttr('href'); //The link is not clickable anymore

最初のオプションはリンクをそのままにしますが、2 番目のオプションはリンクの外観を変更します (デモで確認できます)。2 番目のオプションを使用する場合、origin-href を保存して、後で再アタッチできるようにすることができます。

デモ

于 2015-02-25T11:09:02.757 に答える
2

おわかりのように、はフォーム入力用であり、要素disabledでの使用には有効ではありません。a

代わりに、要素preventDefault()のクリック ハンドラー内で使用して、その動作を停止できます。a

$('a').click(function(e) {
    if (clicksAllowedFlag) {
        // your logic here...
    }
    else {
        e.preventDefault();
    }
});

または、カスタム ロジックを実行せずにリンクの動作のみを停止する場合は、次のようにします。

$('a').click(function(e) {
    !clicksAllowedFlag && e.preventDefault();
});

フラグが に設定されてfalseいる場合は、リンクが無効になっていることが明らかなように UI のスタイルを設定することを検討してください。そうしないと、リンクをクリックしても効果がない理由についてユーザーが混乱する可能性があります。

于 2015-02-25T11:06:11.440 に答える