要在表單提交時將后面的提示文字設置為紅色,你可以使用 jQuery 來動態修改提示文字的樣式。以下是一個示例代碼:
HTML:
html
<form id="myForm">
<input type="text" name="username" required>
<span class="error-message">請填寫用戶名</span>
<button type="submit">提交</button>
</form>
CSS:
css
.error-message {
color: black; /* 默認提示文字顏色 */
}
JavaScript:
javascript
$(document).ready(function() {
$("#myForm").submit(function(event) {
event.preventDefault(); // 阻止表單默認的提交行為
var username = $("input[name='username']").val();
if (username === "") {
$(".error-message").css("color", "red");
} else {
$(".error-message").css("color", "black");
// 繼續提交表單的其他操作
// ...
}
});
});
在上面的代碼中,我們使用 `.submit()` 方法監聽表單的提交事件,并阻止表單默認的提交行為。然后,我們通過選擇器選取用戶名輸入框的值,并進行判斷。如果用戶名為空,我們使用 `.css()` 方法將提示文字的顏色設置為紅色;否則,將提示文字的顏色設置為黑色。
請注意,`.css()` 方法用于修改元素的樣式。它接受兩個參數,第一個參數是要修改的樣式屬性,第二個參數是要設置的值。
你可以根據實際需求修改選擇器和樣式屬性,以適應你的表單結構和樣式要求。
希望這可以幫助你實現在表單提交時將后面的提示文字設置為紅色。