0

したがって、次のような HTML があります。

<div id="setence">
<select id="spellingSuggestions"> 
    <option class="0" value="teh">teh</option> 
    <option class="1" value="the">the</option> 
    <option class="2" value="Te">Te</option> 
    <option class="3" value="tech">tech</option> 
    <option class="4" value="Th">Th</option> 
    <option class="5" value="eh">eh</option> 
</select> 
<select id="spellingSuggestions"> 
    <option class="0" value="wuick">wuick</option> 
    <option class="1" value="quick">quick</option> 
    <option class="2" value="wick">wick</option> 
    <option class="3" value="Vick">Vick</option> 
    <option class="4" value="Buick">Buick</option> 
    <option class="5" value="whack">whack</option> 
</select> 
<span class="correctWord">brown</span>
<select id="spellingSuggestions"> 
    <option class="0" value="fx">fx</option> 
    <option class="1" value="Fax">Fax</option> 
    <option class="2" value="Fox">Fox</option> 
    <option class="3" value="fax">fax</option> 
    <option class="4" value="fix">fix</option> 
    <option class="5" value="fox">fox</option> 
</select> 
<span class="correctWord">jumped</span>
<span class="correctWord">over</span>
<select id="spellingSuggestions"> 
    <option class="0" value="teh">teh</option> 
    <option class="1" value="the">the</option> 
    <option class="2" value="Te">Te</option> 
    <option class="3" value="tech">tech</option> 
    <option class="4" value="Th">Th</option> 
    <option class="5" value="eh">eh</option> 
</select> 
<select id="spellingSuggestions"> 
    <option class="0" value="lzy">lzy</option> 
    <option class="1" value="lazy">lazy</option> 
    <option class="2" value="Ly">Ly</option> 
    <option class="3" value="Lay">Lay</option> 
    <option class="4" value="Loy">Loy</option> 
    <option class="5" value="lay">lay</option> 
</select> 
<span class="correctWord">dog</span>
</div>

各スパンのコンテンツ/値とそれぞれの秒<option>(.1)<select>を順番に取得し、変数に格納しようとしています。

この場合、変数に入れようとしている文字列は、「怠惰な犬を飛び越えた茶色の速いファックス」です。

擬似コードでは、次のことを行います。

  • #sentence のすべての子を反復処理します
  • 現在の子要素がクラス .correctWord であるかどうかを確認します。
  • ある場合は、その内容を取得します。
  • そうでない場合は、2 番目の子の値を取得します。
  • コンテンツと値を順番につなぎ合わせる
  • 新しく構成された文字列を var に格納する

javascript / jQuery でこれを行うにはどうすればよいですか?

4

1 に答える 1

2 
var str = "";
$('#sentence').children().each(function(){
    if($(this).is('.correctWord')){
      str += " "+$(this).text();
    }else if($(this).is('select')){
     str += " "+$(this).find('option').eq(1).val();
    }
})

デモ---> http://jsfiddle.net/8juVe/

于 2013-06-18T22:05:48.613 に答える