1

私は現在、Web アプリケーションで AJAX 要求を実行するためにアンカー タグに依存しています (jQuery を使用)。例えば：

<script type="text/javascript">
    $(document).ready(function() {
        $("#test").click(function() {
            // Perform AJAX call and manipulate the DOM
        });
    });

    <a id="test" href="">Click me!</a>
</script>

ただし、ユーザーがブラウザーで JavaScript を無効にすると、これらのアンカー タグはほとんど役に立たなくなります。これらのアンカー タグの適切な劣化を処理する最善の方法は何ですか? それらすべてをフォームタグ内のボタンに切り替える唯一のオプションですか?

編集：より明確にして、AJAX呼び出しが、セキュリティ上の理由から通常のHTTP GETに公開できないURLへのHTTP POSTであることを指定する必要があります（たとえば、削除URL「/items/delete/1」を考えてください）。それを念頭に置いて、セキュリティ上のリスクがあるため、javascript をオフにしているユーザーを満足させるために、アンカーの href を「/items/delete/1」に変更することはできません。

4

5 に答える 5

6

1つのオプション（私は反対票を投じられると確信しています）は、javascriptをオフにしている人々に迷惑をかけないことです。<noscript>サイトに Javascript が必要であることをユーザーに知らせるタグ内のメッセージを表示します。

これは 2 つのグループの人々に影響を与えます: 故意に JavaScript を無効にしており、おそらく有効に戻す方法を知っていると思われる人々と、古いモバイル デバイスでサイトを閲覧している人々です。

彼らのために開発に何時間も費やす前に、これらの人々のグループがどれほど重要かを考えてください。

于 2009-01-21T22:34:58.573 に答える
3

私が探していた答えは、コメントの 1 つに埋もれています。

<a>HTTP POST 操作を行うためのタグの使用が競合しています。<a>HTTP GET 用に設計されました。<a>操作のセマンティクスをタグに埋め込んだままにしておくと、ここで満足のいく答えは見つかりません。http://www.w3.org/2001/tag/doc/whenToUseGet.htmlを参照して ください。

于 2009-01-21T22:46:06.070 に答える
3

シンプルです。少なくとも、クライアントに配信される HTML では、javascript: URI 構文を href として使用しないでください。

href を使用してサーバーから HTML を配信し、href を使用してユーザーを任意のページに移動させ、アンカー タグの href を置き換え (または onclick イベントをキャプチャし)、既定のアクションを確実に防止しながら、必要なことを行います。イベントファイア用。

<script type="text/javascript">
    $(document).ready(function() {
        $("#test").click(function(e) {
            // Perform AJAX call and manipulate the DOM
            e.preventDefault();
        });
    });

    <a id="test" href="/Proper/URI">Click me!</a>
</script>

また、Unobtrusive JavaScript を読むようにという提案には完全に同意します。

于 2009-01-21T22:25:07.233 に答える
1

Unobtrusive JavaScriptについて読んで、 JS の動作を実際のマークアップから切り離す方法を学んでください。私が投稿する他のものは、他の誰かが他の場所でより良く言ったことの焼き直しにすぎません

于 2009-01-21T22:22:59.640 に答える
1

JS を使用しない場合の最善の策は、送信ボタンのあるフォームを作成し、フォームのアクションを URL に向けることです。

ボタンのスタイルをリンクのように (またはその他のもののように) 変更できます。

<button class="linkstyle" type="submit">Foo</button>
<style type="text/css">
button.linkstyle { border:none; background:none; padding:0; }
<style>

Particletree の記事に、ボタンのスタイリングの良い例があります:ボタン要素の再発見

于 2009-01-21T23:11:12.773 に答える