[英]Disable checkbox based on text value
當用戶在文本區域中輸入文本時,我需要禁用一個復選框,否則它將處於活動狀態。 我嘗試過最相關的活動,但我無法讓它發揮作用。 onkeydown禁用第一次按下並且onchange將在用戶輸入內容然后刪除它時起作用。 在他們離開文本區域后似乎沒有禁用它。
<script type="text/javascript">
function enable_cb(textarea) {
if ($(textarea).val() != "" ) {
$("input.cmb").removeAttr("disabled");
}
else {
$("input.cmb").attr("disabled", true);
}
}
</script>
Comments:<br />
<p><textarea name="issue" id="issue_ta" cols="50" rows="10" class="help" tabindex="2" title="Enter Detailed Description" onchange="enable_cb(this);"></textarea></p>
<p><input name="no_issue" type="checkbox" id="no_issue" class="cmb" />No Issues to Report</p>
<p class="label">Enter Current Vehicle Mileage:</p>
<p><input type="tel" name="record_mileage" class="required" tabindex="3" title=" Enter Current Mileage " size="25"/></p>
<p><input type="submit" name="Submit" value="Send"/></p>
</form>
刪除onclick處理程序並執行:
$(function() {
$("#issue_ta").on('change keyup', function() {
$("input.cmb").prop("disabled", this.value.length);
});
});
這個
$("input.cmb").attr("disabled", true);
應該是這個
$("input.cmb").attr("disabled", "disabled");
為什么不為textArea使用blur事件..這將確保一旦textarea失去焦點就會執行代碼。
試試這個代碼..
// Your Markup..
Comments:<br />
<p><textarea name="issue" id="issue_ta" cols="50" rows="10" class="help" tabindex="2" title="Enter Detailed Description" ></textarea></p>
<p><input name="no_issue" type="checkbox" id="no_issue" class="cmb" />No Issues to Report</p>
<p class="label">Enter Current Vehicle Mileage:</p>
<p><input type="tel" name="record_mileage" class="required" tabindex="3" title=" Enter Current Mileage " size="25"/></p>
<p><input type="submit" name="Submit" value="Send"/></p>
// Your jQuery code..
$(function() {
$('#issue_ta').on('blur' , function(){
var val = $('#issue_ta').val();
if(val == ''){
$('#no_issue').attr('disabled', true);
}
else{
$('#no_issue').attr('disabled', false);
}
});
});
你可以查看這個小提琴,找到一個有效的例子http://jsfiddle.net/sushanth009/A46py/
謝謝大家。 每個回應都讓我朝着正確的方向前進。
<script type="text/javascript">
function enable_cb(textarea) {
if ($(textarea).val() !== "") {
$("input.cmb").prop("disabled", true);
}
else {
$("input.cmb").prop("disabled", false);
}
}
</script>
Comments:<br />
<p><textarea name="issue" id="issue_ta" cols="50" rows="10" class="help" tabindex="2" title="Enter Detailed Description" onblur="enable_cb(this);"></textarea></p>
<p><input name="no_issue" type="checkbox" id="no_issue" class="cmb" />No Issues to Report</p>
<p class="label">Enter Current Vehicle Mileage:</p>
<p><input type="tel" name="record_mileage" class="required" tabindex="3" title=" Enter Current Mileage " size="25"/></p>
<p><input type="submit" name="Submit" value="Send"/></p>
</form>
“他們離開文本區后似乎沒有禁用它。”
.blur
在這種情況下會有所幫助 - 它會檢測用戶何時離開元素,然后您可以應用所需的效果。 .blur文檔
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.