在以下示例中,如果您手动更改文本框中的文本,您会在文本框下方看到不同的消息。
如果您单击其中一个按钮(即,如果您单击按钮设置为 4),我想要相同的行为,您应该会看到 Mid-to-Mod 脆弱出现在文本输入下方。
我的 HTML
<input type="text" id="total-frailty-score" value="9" />
<div id="frail-category-area">
<div id="frail-category"></div>
</div>
<input type="button" id="a" value="Set as 4" />
<input type="button" id="b" value="Set as 2" />
<input type="button" id="c" value="Set as 7" />
JavaScript/JQuery
$(function () {
function FrailCategory() {
if ($('#total-frailty-score').val() == 9) {
$('#frail-category').text('Terminally')
} else if ($('#total-frailty-score').val() >= 1 && $('#total-frailty-score').val() <= 3) {
$('#frail-category').text('Pre-Frail')
} else if ($('#total-frailty-score').val() >= 4 && $('#total-frailty-score').val() <= 6) {
$('#frail-category').text('Mid-to-Mod frail')
} else if ($('#total-frailty-score').val() >= 7 && $('#total-frailty-score').val() <= 8) {
$('#frail-category').text('Severely frail')
}
}
$('#total-frailty-score').change(FrailCategory).triggerHandler("change");
});
$('#a').click(function() {
$('#total-frailty-score').val('4');
});
$('#b').click(function() {
$('#total-frailty-score').val('2');
});
$('#c').click(function() {
$('#total-frailty-score').val('7');
});