Question

我使用此代码进行验证：

<html>
<head>
     <script>
      function validateNew() {
        var x1 = document.forms["register"]["firstname"].value;
          if (x1 == null || x1 == "") {
           alert("Please enter your first name.");
      return false;
     }

   }
 </script>
</head>
<body>
<form name="register" method="POST" onsubmit="return validateNew()">
 <label id="fname_lbl" class="">First Name
  <input type="text" name="firstname">
<input type="submit" value="Submit">
</form>

但我想做一些与众不同的事情。我有一段时间没有这个代码，但我不记得我把它放在哪里。基本上，我希望验证有条不紊地触发html中的代码，而不是弹出窗口，这将实现阻止提交的目标，但是显示，让我们说，文字在红色字段上方，用红色表示，＆＃34;必填字段＆＃34;。

伪代码：

<html>
<head>
     <script>
      function validateNew() {
        var x1 = document.forms["register"]["firstname"].value;
          if (x1 == null || x1 == "") {
      $trigger = for label id('fname_lbl') class=="require";
      return false;
     }

   }
 </script>
</head>
<body>
<form name="register" method="POST" onsubmit="return validateNew()">
 <label id="fname_lbl" class="<? $trigger ?>">First Name
  <input type="text" name="firstname">
<input type="submit" value="Submit">
</form>

名为＆＃34;的类需要＆＃34;将改变＆＃39; First Name＆＃39;的字体颜色。变红了。

因此在验证时，当代码发现没有名字时，它会使用触发变量修改该变量，该变量在＆＃39; class＆＃39;。

我知道我的伪代码已经过时了。我记得几年前能做类似的事情。

修改

我发现代码片段

<head>
<script>
    $(document).ready(function (){
        $("#b_down").change(function() {

            if ($(this).val() < 20 ) {
                $("#pmi").show();
            }else{
                $("#pmi").hide();
            } 
        });
    });
 </script>
 </head>
<body>    
<select name="b_down" id="b_down">
<option value=""></option>
<option value="1">1</option>
<option value="2" >2</option>
<option value="3" >3</option>
</select>

<? if ($row['b_down']<2) { ?>
<span id="pmi" style="display;" class="dropt">PMI:&nbsp; 
<? } else { ?>
<span id="pmi" style="display:none;" class="dropt">PMI:&nbsp; 
<? } ?>

基本上，在更改事件中，它显示或隐藏特定输入。不知道如何将它应用到我的项目中。

Answer 1

你可以用这个：

<html>
    <head>
        <title>LIGHTBOX EXAMPLE</title>
        <style>
                .normal {
                color: #0f0;
                }
                .required {
                color: #f00;
                }
        </style>
    </head>
    <body>
        <form name="register" method="POST" onsubmit="return validateNew();">
            <label id="fname_lbl" class="normal">First Name</label>
            <input type="text" name="firstname">
            <input type="submit" value="Submit">
        </form>
    </body>
    <script>
    function validateNew() {
        var x1 = document.forms["register"]["firstname"].value;
        if (x1 == null || x1 == "") {

            document.getElementById("fname_lbl").className = "required";
            return false;
        }
    }
    </script>

在验证使用javascript修改HTML代码

1 个答案: