當滿足某個條件時，我想禁用一些輸入文本。一個輸入文本值將用作條件的鍵。想象一下有 6 個輸入和 2 個從表中獲取資料，這些從表 1 中獲取資料以存盤條件值。我想要一個場景，如果 text2.value 是 'test' 那么 text3 和 text 4 應該被禁用。
這就是我在標記 js、jq 和 hmtl 時所做的，也許有人可以提供幫助
html
<input type="hidden" name="ttype[<?php echo $ix ?>]" value="<?php echo
$rowx['testtype']; ?>"/>
<td colspan="0"> Result <br>
<div>
<select name="negpos[<?php echo $ix ?>]" style='width:50px'>
<option selected value=''> Select One </option>
<option value='Pos'> Positive</option>
<option value='Neg'> Negative</option>
<option value='N/P'> Not Provided</option>
</select>
<span id="sresultInfo">
</span>
</div>
</td>
<td><input type="text" name="WBC[<?php echo $ix ?>]"size ="3" /></td>
<td><input type="text" name="HGB[<?php echo $ix ?>]"size ="3" /></td>
<td> <input type="text" name="RBC[<?php echo $ix ?>]" size ="3" value=""/></td>
<td><input type="text" name="Lymph[<?php echo $ix ?>]"size ="3"/></td>
<td><input type="text" name="MCV[<?php echo $ix ?>]" size ="3"/></td>
<td><input type="text" name="Gran[<?php echo $ix ?>]" size ="3"/></td>
<td> <input type="text" name="MCH[<?php echo $ix ?>]" size ="3"/> </td>
js
$(document).ready(function(){
var ttyp = document.getElementById("ttype").value ;
if (ttyp = "MPP" ){
document.getElementById('WBC').disabled = true;
document.getElementById('HBG').disabled = true;
document.getElementById('RBC').disabled = true;
} else {
document.getElementById('WBC').disabled = false;
document.getElementById('HGB').disabled = false;
document.getElementById('RBC').disabled = false;
}
});
uj5u.com熱心網友回復：
你可以做類似的事情。disabletext 表示要匹配以禁用的文本，而 disablefieldids 是逗號分隔值的串列，其中包含要禁用的欄位的 id。
$('input').on('change', function() {
var conditions = $(this).data();
var inputValue = $(this).val();
if(inputValue == conditions.disabletext) {
conditions.disablefieldids.split(",").map(function(id) {
$('#' id).attr('disabled', 'disabled');
})
}else {
conditions.disablefieldids.split(",").map(function(id) {
$('#' id).removeAttr('disabled');
})
}
})<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
<tr>
<td>
<input type="text" data-disabletext="test" data-disablefieldids="HGB,RBC" name="WBC"size ="3" />
</td>
<td><input type="text" id="HGB" name="HGB"size ="3" /></td>
<td> <input type="text" id="RBC" name="RBC" size ="3" value=""/></td>
<td><input type="text" id="Lymph" name="Lymph"size ="3"/></td>
<td><input type="text" id="MCV" name="MCV" size ="3"/></td>
<td><input type="text" id="Gran" name="Gran" size ="3"/></td>
<td> <input type="text" id="MCH" name="MCH" size ="3"/> </td>
</tr>
</table>uj5u.com熱心網友回復：
我想創建一個通用物件，而不是將禁用文本和欄位存盤到輸入屬性，這樣它會給我們更多的可用性，
const InputCondition = [
{"disabletext":"Test","disablefieldids":["HGB","RBC"]},
{"disabletext":"ABC","disablefieldids":["MCV","MCV"]}
];
這是更改初始化（根據您的需要更改）
$('input').on('change', function () {
func_makeInputdisable($(this).val());
});
// you can call this onl oad // pass the text value in param.
function func_makeInputdisable(lookingForText) {
let matches = InputCondition.find(x => x.disabletext == lookingForText.trim()).disablefieldids;
//Remove all the disable inputs if in need
//$('.AllInputClass').removeAttr('disabled');
if (matches.length > 0) {
$.each(matches, (index, inputID) => {
let $ele = $(`#${inputID}`);
if (typeof ($ele) != 'undefined')
$ele.attr('disabled', 'disabled');
});
}
}
// 要啟用文本框，只需在每個輸入上添加相同的類并使用類似 $('.AllInputClass').removeAttr('disabled'); 放置在類名稱為“AllInputClass”的函式上方的注釋中
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/377293.html
標籤：javascript html 查询