저는 jQuery를 처음 접했습니다. 저를 초보자로 생각하십시오. 라디오 버튼이있는 PHP 양식이 있습니다. 선택된 라디오에 따라 텍스트 상자를 비활성화하고 싶습니다. 다음은 시나리오입니다.
라디오 버튼 : 현금 및 수표 텍스트 상자 : 수표 번호 및 수표 날짜
기본적으로 Textbox Check No와 Check Date는 비활성화되어 있고 Radio Cash는 Checked입니다.
내 header.php에 JQuery 1.12.3 분을 추가했습니다.
Header.php
!-- JQuery 1.12.3 JS -->
<script src="../js/jquery-1.12.3.min.js"></script>
MainPage.php
<tr>
<td class="col-md-4"><label class="control-label" for="payMode">Mode</label></td>
<td class="col-md-8">
<label class='radio-inline'><input type='radio' name='rbPayMode' id='bd' value='0' checked>Cash</label>
<label class='radio-inline'><input type='radio' name='rbPayMode' id='bd' value='1'>Cheque</label>
</td>
</tr>
<tr>
<td class="col-md-4"><label class="control-label" for="ChequeNo">Cheque No</label></td>
<td class="col-md-8"><input type="number" name="txtChequeNo" pattern="^[0-9]" min="0" step="1" class="form-control" placeholder="Enter Cheque No" disabled></td>
</tr>
<tr>
<td class="col-md-4"><label class="control-label" for="ChequeDate">Cheque Date</label></td>
<td class="col-md-8"><input type="date" name="txtChqueDate" class="form-control" placeholder="Enter Cheque Date" disabled></td>
</tr>
도와주세요
다음과 같이 할 수 있습니다.
$(':radio[name=rbPayMode]').change(function () {
var prop = this.value == 0;
$('input[name=txtChequeNo], input[name=txtChqueDate]').prop({ disabled: prop, required: !prop });
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr>
<td class="col-md-4"><label class="control-label" for="payMode">Mode</label></td>
<td class="col-md-8">
<label class='radio-inline'><input type='radio' name='rbPayMode' id='bd' value='0' checked>Cash</label>
<label class='radio-inline'><input type='radio' name='rbPayMode' id='bd' value='1'>Cheque</label>
</td>
</tr>
<tr>
<td class="col-md-4"><label class="control-label" for="ChequeNo">Cheque No</label></td>
<td class="col-md-8"><input type="number" name="txtChequeNo" pattern="^[0-9]" min="0" step="1" class="form-control" placeholder="Enter Cheque No" disabled></td>
</tr>
<tr>
<td class="col-md-4"><label class="control-label" for="ChequeDate">Cheque Date</label></td>
<td class="col-md-8"><input type="date" name="txtChqueDate" class="form-control" placeholder="Enter Cheque Date" disabled></td>
</tr>
</table>이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다