値を設定/削除
<input type="text" id="inputText" /><br>
<input type="button" id="insertButton" value="入力" />
<input type="button" id="clearButton" value="クリア" />
<script>
$('#insertButton').on('click', function() {
$('#inputText').val('サンプルです');
});
$('#clearButton').on('click', function() {
$('#inputText').val('');
});
</script>
ラジオボタンがONの場合のみ項目を表示
<input type="radio" id="isRegistOn" value="true" name="toroku" />登録あり
<input type="radio" id="isRegistOff" value="false" name="toroku" checked/>登録なし<br>
<input type="text" id="userName" value=""/>
<script>
if ($('#isRegistOff').is(':checked')){
$('#userName').hide();
} else {
$('#userName').show();
}
$('#isRegistOn').on('click', function() {
$('#userName').show();
});
$('#isRegistOff').on('click', function() {
$('#userName').hide();
});
</script>
<input type="radio" id="rd0" name="radio_test" value="0番" />ラジオテスト0
<input type="radio" id="rd1" name="radio_test" value="1番" />ラジオテスト1
<input type="radio" id="rd2" name="radio_test" value="2番" />ラジオテスト2<br>
<input type="button" id="select1Button" value="1番を選択" />
<input type="button" id="clear1Button" value="1番の選択解除" />
<input type="button" id="clearAllButton" value="全選択解除" />
<input type="button" id="getButton" value="値を取得" />
<script>
$('#select1Button').on('click', function() {
$('#rd1').prop('checked', true);
});
$('#clear1Button').on('click', function() {
$('#rd1').prop('checked', false);
});
$('#clearAllButton').on('click', function() {
$("input[name='radio_test']").prop('checked', false);
});
$("#getButton").on('click', function() {
var radioVal = $("input[name='radio_test']:checked").val();
alert(radioVal);
});
</script>
ボタンの二重クリック防止
ボタンはinput type="button"ではなく、buttonにしておくこと
⇒連打しても正しく動作する
<button type="submit" formaction="offer_confirm">確認へ進む</button>
<script>
$('button, input[type="button"]').on('click', function() {
$(this).prop("disabled", true);
});
</script>