JavaScript 需要输入更改输入边框

javascript required input change input border

本文关键字：输入 边框 JavaScript      更新时间：2023-09-26

>im 如果用户在发布后将输入留空，则尝试更改边框

好吧，我已经尝试过：

<script>
   function required (id) {
       document.getElementById(id).style.border = "#FF0000 5px inset";
   }
</script>
<form method="post">
<input type='text' id='req' name='t'>
</form>
<?
if ($_POST)
   if (isset($_POST['t']))
        echo "u've done";
   else
        echo "<script>required('req');</script>";
?>

将 PHP 代码更改为以下内容：

<?php // <- no short tag
if ($_POST) { // <-- add brackets
   if (isset($_POST['t']))
        echo "u've done";
   else
        echo "<script>required('req');</script>";
} // <-- add brackets
?>

我的javascript解决方案：

.HTML：

<form method="post" id="form1">
  <input type='text' id='req' name='t'>
</form>
<button type="submit" form="form1" value="Submit" onclick="myFunction()">Submit</button>

JAVASCRIPT ：

function myFunction() {
  if (document.getElementById("req").value == '') {
    event.preventDefault();
    required("req");
  } else {
    alert("pas vide");
  }
}
function required(id) {
  document.getElementById(id).style.border = "#FF0000 5px inset";
}

代码笔

我认为我有一个更好的方法：

<form method="post">
<input type='text' id='req' name='t' <?php if(!$_POST['t']): ?>class='required-input'<?php endif;?>>
</form>

然后你把"#FF0000 5px inset"放在你的css中，创建类"必需输入"或其他什么。

代码中没有侵入性脚本！

相关文章：