これにはおそらく非常に簡単な説明があります(そしておそらくそれを行うためのはるかにクリーンな方法です)が、私は初心者であり、それを完全に理解することはできません. どんな支援も学習プロセスに役立ちます...
ユーザーがドロップダウン リストから選択したものに基づいて (show
ではなく) 1 つの div または別の div を表示する 1 つのスクリプトがあります。hide
そのようです:
var PickDiv = (function(){
var _obj = {};
var hideShow = function(elem){
if($(elem).val() === '1'){
$("#slider_action").show();
$("#slider_dollar").hide();
}else if($(elem).val() === '2'){
$("#slider_dollar").show();
$("#slider_action").hide();
}else{
$("#slider_dollar, #slider_action").hide();
}
};
_obj.checkValue = function(){
hideShow($('#build_opt'))
};
var events = function(){
$('#build_opt').change(function(){
hideShow(this);
});
};
$(document).ready(function(){
events ();
checkValue ();
});
return _obj;
}());
これはうまく機能し、ドロップダウンから選択されたものに基づいて適切な div を表示します。これと同じアイデアをコードの後半で再利用して、同じ効果を得ることができると考えました。div が表示されたら (上記のスクリプトに関連する選択を行った後)、追加のオプションを含む別のドロップダウンを提供する必要があります。ユーザーがこれらのいずれかを選択すると、div が表示されます。だから、私は次のようなものを使うことができると考えました:
var RunRate = (function(){
var _obj2 = {};
var hideShow_2 = function(elem_2){
if($(elem_2).val() === '6'){
$("#db_sign").show();
$("#app_down", "#in_redem", "#site_vis", "#cont_ent" ).hide();
}else if($(elem_2).val() === '7'){
$("#app_down").show();
else{
$("#app_down", "#in_redem", "#site_vis", "#db_sign", "#cont_ent" ).hide();
}
};
_obj2.checkValue_2 = function(){
hideShow_2($('#action_type_2'))
};
var events_2 = function(){
$('#action_type_2').change(function(){
hideShow_2(this);
});
};
$(document).ready(function(){
events_2 ();
checkValue_2 ();
});
return _obj2;
}());
もちろん、これはうまくいきません。運が悪かったので、さまざまなことを試しました。コードから最初のスクリプトを除外すると、2 番目のスクリプトは正常に機能するので、機能することがわかります。変数を共有する2つのスクリプトと関係があるか、明らかに欠けているjqueryに関する何かがあると思います。
どんな助けでも大歓迎です。全体として、互いに干渉することなく、これらのタイプの依存ドロップダウンの多くを実行できるようにすることを目指しています。
ご協力いただきありがとうございます!
アップデート:
2 番目のスクリプトでは、次のように置き換えます。
$(document).ready(function(){
と
$( window ).load(function() {
その後、問題は解決されます。したがって、明らかに問題は相互に干渉する document.ready に関連していますが、特にこれらの依存ドロップダウンをさらに使用したい場合は、上記の「ハック」なしでこれを修正する方法がわかりません。別の変数を渡して、代わりにそれを呼び出す方法はありdocument
ますか?
更新 2
問題を解決しました...私の元のコードは、未定義の参照(checkValue
)が原因でエラーをスローしていました。そのエラーにより、ドキュメントの準備ができていて、2 番目の関数で機能しませんでした。以下の私の回答でより詳細な説明を参照しました。