0

チェック内容に応じて変化するドロップダウンメニューを作成するために使用しているコードがいくつかあります。ページから分離されたjavascriptとhtmlは正常に機能しますが、jqueryと同時にロードされ、すべてがダイアログボックスに配置されると、次のようなエラーが表示されます

クライアントのfirebugでこのエラーを確認できますが、jsfiddleには表示されないようですが、表示されたときにドロップダウンが機能しません...

document.form1a.damage is undefined
[Break On This Error]   
document.form1a.damage[i].options.length=0;

これは、私が使用している他のjqueryではなく、jqueryコードのダイアログボックス部分が原因であり、ダイアログボックスが削除されると、ドロップダウンメニューが完全に正常に機能することです。すべてのコードを JsFiddle にアップロードしました

ジャスフィドル

4

2 に答える 2

0

問題は、jsFiddle が関数で定義された変数を作成する$(window).load関数でコードをラップしていることです。関数の実行が完了すると、関数はスコープ内になくなります。つまり、ハンドラーを使用して関数を参照することはできません。fill_damage$(window).load$(window).loadfill_damageonchange

これに対する解決策は、次のいずれかです。

  1. それをあなたに含め、jQueryを使用して（すでに使用しているため推奨されます）、またはより伝統的なJavaScriptメソッド（（すでにjQueryを使用しているため推奨されません）など）を使用してハンドラー$(function) に割り当てます。clickaddListener
  2. または フレームワークの選択をnoWrap (head)またはに変更しますno wrap (body)。

私はあなたのフィドルを書き直しました（コメントがたくさんあります）。ここで確認できます: http://jsfiddle.net/9YTwv/7/

お役に立てれば。

于 2012-10-08T12:43:49.923 に答える
0

そのコードが実行されると、フォームは空になります。Jquery ui ダイアログは、html 構造全体を独自の div (通常はページの下部) に移動し、すべてのスタイル、クラスなどを適用します。

jsfiddle でこれを確認するには、コード ロード イベントを に変更しno wrap (head)ます。フレームワークの選択の上にあります。あなたが言及したエラーが発生します。

その時のhtml構造を見るにはfirebug/chrome inspectorを使います。あなたが持っている：

<form name="form1a" method="post" id="form1a"></form>
<div dialog1></div>
<div dialog2></div>
<div overlay></div>

この問題の解決策として、selects に独自の ID を与え、以下を使用することを検討してください。

document.getElementById('selectDamage0').options.length = 0;

... または、フォーム表記を使用する代わりに、クラス名とインデックスなどを使用し続けます。

アップデート：

onchange を jquery にバインドし、それを介してオプションを設定するだけの別のアプローチを示す jsfiddle を次に示します。流れを示すために少しコメントしました -- 関数は一番下にあります:

http://jsfiddle.net/xCMU6/

更新 2:

このようにベース レベルで ID を管理する古い方法は、共通のプレフィックス/サフィックスを使用することです。したがって、最初の選択はtype-0withdamage-0です。次に、他の単語を参照するには、単語を交換します (または - で分割します)。

于 2012-05-18T02:12:40.363 に答える