JavaScript と HTML フォーム要素を使用して、配列を埋めて解析しようとしています。次のテストでは、期待どおりの結果が生成されます ("Test1 Test2 Test3" は宛先 div でレンダリングされます)。動作するテストコードは次のとおりです。
<div>
<span id="put-stuff-here"></span>
<span id="put-stuff-here2"></span>
<span id="put-stuff-here3"></span>
</div>
<script type="text/javascript">
var itemSelected = { 'fields': [ 'Test1', 'Test2', 'Test3' ] }
document.getElementById('put-stuff-here').innerHTML = itemSelected.fields[0];
document.getElementById('put-stuff-here2').innerHTML = itemSelected.fields[1];
document.getElementById('put-stuff-here3').innerHTML = itemSelected.fields[2];
})
</script>
ただし、フォーム フィールドを使用して変数「itemSelected」を定義しようとすると、目的の div に何もレンダリングされません。動作しないコードは次のとおりです。
<div>
<form>
<select id="getItem">
<option value="{ 'fields': [ 'Test1', 'Test2', 'Test3' ] }">ItemName</option>
<option value="{ 'fields': [ 'Test4', 'Test5', 'Test6' ] }">ItemName2</option>
</select>
</form>
</div>
<div>
<span id="put-stuff-here"></span>
<span id="put-stuff-here2"></span>
<span id="put-stuff-here3"></span>
</div>
<script type="text/javascript">
$("#getItem").change(function () {
var itemSelected = $(this).val();
document.getElementById('put-stuff-here').innerHTML = itemSelected.fields[0];
document.getElementById('put-stuff-here2').innerHTML = itemSelected.fields[1];
document.getElementById('put-stuff-here3').innerHTML = itemSelected.fields[2];
})
.change();
</script>
何らかの理由で、「itemSelected」に渡された値が配列として処理されません。ここの誰かが親切に見て、おそらく解決策を提案してくれることを願っています.
ありがとう、
-マイケル