誰かがテキストエリア内にテキストを入力すると、JavaScript でドロップダウン ボックスを非表示にしようとしています。
これは私がこれまでにやったことです:
HTML
<table>
NOTES OF A POST MORTEM EXAMINATION ON THE BODY OF A<br>
<select name="select86" id="travel_arriveVia" onchange='CheckColors86(this.value);'>
<option>Select</option>
<option value="Cattle">Cattle</option>
<option value="Buffalo">Buffalo</option>
<option value="Horse">Horse</option>
<option value="Camel">Camel</option>
<option value="Dog">Dog</option>
<option value="Sheep">Sheep</option>
<option value="Pig">Pig</option>
<option value="Goat">Goat</option>
<option value="Deer">Deer</option>
<option value="Others">Others</option>
</select>
<tr>
<td></td>
<td></td>
<td></td>
<td>
<textarea rows="3" cols="25" name="div86" id="color86" style='display:none'></textarea>
</td>
</tr>
</table>
JavaScript
function CheckColors86(val)
{
var element=document.getElementById('color86');
if(val=='Others')
element.style.display='block';
else
element.style.display='none';
}
jQuery を使用できる場合は、次のようにすることができます。
$('#color86').keyup(function() {
$('#travel_arriveVia').css('display', 'none');
});
ここにjsfiddle: https://jsfiddle.net/ezd5ajmf/
またはスニペットとして:
$('#color86').keyup(function() {
$('#travel_arriveVia').css('display', 'none');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
NOTES OF A POST MORTEM EXAMINATION ON THE BODY OF A<br>
<select name="select86" id="travel_arriveVia">
<option>Select</option>
<option value="Cattle">Cattle</option>
<option value="Buffalo">Buffalo</option>
<option value="Horse">Horse</option>
<option value="Camel">Camel</option>
<option value="Dog">Dog</option>
<option value="Sheep">Sheep</option>
<option value="Pig">Pig</option>
<option value="Goat">Goat</option>
<option value="Deer">Deer</option>
<option value="Others">Others</option>
</select>
<tr>
<td></td>
<td></td>
<td></td>
<td>
<textarea rows="3" cols="25" name="div86" id="color86"></textarea>
</td>
</table>
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加