-1

IE バージョン 7 および 8 では機能しない分岐ドロップダウンがありますが、他のすべてのブラウザーでは機能します。

ライブ デモの js Fiddle リンクは次のとおりです: http://jsfiddle.net/r64w7/

私のコード:

HTML :

<div>
    <label >Select a step</label>
    <select id="selectCreateNew">
            <option value="input">
                    Input
            </option>
            <option value="radio">
                    Radio
            </option>
    </select>
</div>
   <div id="section1" style="display:none;">
      <label >Input</label>
      <input name="" type="text"/>
    </div>
   <div id="section2" style="display:none;">
         <label >Radio</label>
         <input name="" type="radio" value=""/>
   </div>

JavaScript

var sections ={
'input': 'section1',
'radio': 'section2',
};

 selection = function(select) {

 for(i in sections)
 document.getElementById(sections[i]).style.display = "none";    
 document.getElementById(sections[select.value]).style.display = "block";

  }

  document.getElementById('selectCreateNew').addEventListener('change', function() {

  selection(this); 
try{for(var lastpass_iter=0; lastpass_iter < document.forms.length; lastpass_iter++)
   { var lastpass_f = document.forms[lastpass_iter];
     if(typeof(lastpass_f.lpsubmitorig2)=="undefined")
   { lastpass_f.lpsubmitorig2 = lastpass_f.submit; lastpass_f.submit = function()
     { var form=this; var customEvent = document.createEvent("Event");
          customEvent.initEvent("lpCustomEvent", true, true);
          var d = document.getElementById("hiddenlpsubmitdiv");
          for(var i = 0; i < document.forms.length; i++)

          { if(document.forms[i]==form){ d.innerText=i; } }
          d.dispatchEvent(customEvent); 
          form.lpsubmitorig2(); } } }}catch(e){}

  });

私は Java スクリプトと jQuery が本当に苦手です。これは他の投稿から入手しました。彼が IE 7 および 8 で動作していないために彼が何を問題としているのかはわかりません。IE 7 または 8 でこれを機能させる方法はありますか。IE 7 でサポートできるようになれば素晴らしいことです。

ありがとう

4

1 に答える 1

2

質問にjQueryのタグが付いていないことは知っていますが、質問で言及されているので、jQueryを使用すると実際には非常に簡単なので、jQueryベースの回答が適切だと思います。

これが HTML コードです。少し変更しました - オプションの変更された値と<div>セクションの余分なラッパーに注意してください:

<div>
    <label >Select a step</label>
    <select id="selectCreateNew">
            <option value="section1">
                    Input
            </option>
            <option value="section2">
                    Radio
            </option>
    </select>
</div>
<div id='sections'>
    <div id="section1" style="display:none;">
       <label >Input</label>
       <input name="" type="text"/>
    </div>
    <div id="section2" style="display:none;">
         <label >Radio</label>
         <input name="" type="radio" value=""/>
    </div>
</div>

..そして魔法を行うためのいくつかのjQueryコード：

$('#selectCreateNew').change(function() {
    var showme = $(this).val();
    $('#sections>div').each(function(i,e) {
        $(e).toggle(e.id === showme);
    });
});

ええ、それはそれと同じくらい短いです。:-)

ここではjsFiddleとして

于 2013-06-14T16:32:04.650 に答える