1

リンクをクリックしたときに JavaScript 関数を呼び出そうとしています。実際には、ポストメソッドを使用してリンクをクリックしてフォームを送信したいので、以下を実行しようとしています-

<a href="javascript:submitCategory(this)" >Handicrafts</a>

そしてJavaScriptで

function submitCategory(varthis)
{   
    alert(varthis.value);
}

重要な質問がいくつかあります: 1>リンクをクリックすると、関数 submitCategory が 2 回呼び出されます。多くの分析の結果、2 つの js ファイルが含まれていることがわかり、そのうちの 1 つを削除すると、関数が 1 回だけ呼び出されました。私が含めたときの意味

<script type ="text/javascript" src="jquery.js"></script>
    <script type ="text/javascript" src="cWed.js"></script>

submitCategory 関数が 2 回呼び出される

そして、それらの1つを削除して含めると

<script type ="text/javascript" src="jquery.js"></script>

submitCategory 関数は 1 回だけ呼び出されます。

なぜこのようになっているのですか?

2> alert(thisvar.value) は Handicrafts を返すはずですが、undefined を返します。これはなぜですか?

3>href="javascript:submitCategory(this)" の正確な意味は何ですか? 私はどのチュートリアルでもこれに遭遇していません。ここにこれを含めると、要素「a」を参照する必要がありますよね?

4

2 に答える 2

0
  1. の内容を投稿していないので、cWed.jsなぜ二重送信されているのかを知るのは難しいですが、私の推測ではclick、デフォルトのハンドラーを複製している独自のハンドラーが含まれていると思います。

  2. varthis.valueが機能しない理由は、要素に.valueのみ使用され、ユーザーが入力またはメニューから選択した値が含まれているためです。要素のテキスト コンテンツを取得するには、 を使用する必要があります。<input><select>.innerHTML

  3. で始まる URI はjavascript:、ネットワーク上の場所からページをフェッチする代わりに、ブラウザーがそのプレフィックスの後にある Javascript コードを実行する必要があることを意味します。これは公式に認められた URI スキームではありません (Internet-Draft RFC がありましたが、2 年前に有効期限が切れました) が、すべてのブラウザーがサポートしています。

  4. コードがjavascript:URIから実行されている場合this、クリックされたのはウィンドウであり、要素ではありません。要素に設定するには、onclickハンドラーを使用する必要があります。this

以下の作品:

<a href="javascript:void(0)" onclick="submitCategory(this); return false;" >Handicrafts</a>

function submitCategory(varthis)
{   
    alert(varthis.innerHTML);
}

フィドル

于 2013-07-04T19:34:53.920 に答える
0

1. 修飾子 'javascript:' を使用する必要はありません
。 2. html でイベントをフックする場合は、常に のように実行してくださいevent_handler(event)。注 : event はイベント オブジェクトです。ここではランダム変数ではありません。詳細については、Web 上のさまざまな場所で読むことができます。あなたの場合varthisはイベントオブジェクトです。この要素にアクセスするvarthis.targetには、その内部の html を取得します。3 varthis.target.innerHTML
. 関数が呼び出されたときに、イベント タグを介して呼び出し元の要素の html コンテンツを明示的に取得するか、jquery を使用する必要があります。現在渡していると思う方法で変数を渡すことはできません。
4. 実際にフォームを送信しようとしている場合は、HTML ではなくスクリプトで onSubmit イベントをフックし、そこにカスタム フォーム送信コードを配置することをお勧めします。フォームの送信でカスタムを行う必要がない場合はaction、フォームの属性にターゲット サーバー関数の URL を入力するだけでかまいません。

サンプルコード:

<form>
    <a href="#" id="submitCategoryLink">Submit Category</a>
</form>
<script type="text/javascript">
    $('#submitCategoryLink').on('click', function (e) {
        alert(e.target.innerHTML)
    });
</script>
于 2013-07-04T19:05:19.960 に答える