为html表单提供默认值,并提供在$_POST之前更改值的选项


Provide default values for html form, with option to change values before $_POST

我目前正在创建一个网页上的html表单,我想知道是否有办法添加默认值的文本框,但用户也可以只是删除默认文本,并在新的文本输入,如果他需要吗?

我现在拥有的是这个…

<html>
  <body>
    <form method="post">
      Suspend: <input type="text" name="sus"><br />
      Device Name: <input type="text" name="dev"><br />
      IP: <input type="text" name="ip"><br />
      Dependency: <input type="text" value="none" name="depend"><br />
      Email: <input type="email" value="abc@123.com" name="email">
      <input type="submit" value="submit" name="submit">
    </form>
    </body>
    </html>
 <?php
  if(isset($_POST['sumbit']))
 {
   $sus=$_POST['sus'];
   $dev=$_POST['dev'];
   $ip=$_POST['ip'];
   $depend=$_POST['depend'];
   $email=$_POST['email'];
    if(isset($sus) && isset($dev) && isset($ip) && isset($depend) && isset($email)
     {
       $update=mysqli_query($con, "UPDATE table SET Suspend=$sus, Device=$dev, IP=$ip,   Dependence=$depend, Email=$email WHERE id=$id");
      }
 }

对于email和dependency字段,它们在95%的情况下都是默认值,但不是所有情况下都是,我的老板希望为它们提供默认值,但也希望他们能够更改它们…然后我用这些$_POST结果执行mysql查询来更新数据库…现在,即使您更改了表单中字段中的文本,它仍然会在数据库中输入默认值。我需要它的地方,如果他们不改变默认值,那么默认值将被添加到数据库…如有任何帮助,不胜感激

HTML 5具有INPUT标记的新占位符属性,但是当您在字段上键入时,该值将消失。INPUT标签也有value属性

试着看看这个:占位符

占位符是在输入中显示的默认文本。但是,如果用户没有插入任何内容,则在提交表单时不包含占位符值。value=""仍会被识别

你可以在php中获得这样的值

$value = $_POST['email'];

如果你在输入框中输入了什么,你将得到的值而不是默认值。

如果你使用html5,你需要使用占位符attr,看看这里:

http://davidwalsh.name/html5-placeholder

由于占位符attr仍然是相当新的,并且不支持旧的浏览器,这里有一个后备方案,可以用来提供与占位符attr相同的功能。

if (!("placeholder" in document.createElement("input"))) {
    var inputs = document.querySelectorAll("input[placeholder]"),
        input,
        dateDefault;
    for (var i = 0, len = inputs.length; i < len; i++) {
         input = inputs[i];
         input.value = input.getAttribute("placeholder");
         input.addEventListener("focus", function() {
             dateDefault = this.getAttribute("placeholder");
             (this.value === dateDefault) && (this.value === "");
         }, false);
         input.addEventListener("blur", function() {
             (this.value === "") && (this.value === dateDefault);
         }, false);
    }
}

如果占位符attr不可用,它将使用您为占位符attr设置的值并将其赋值给该值。然后使用一些js,你可以检测输入字段是否为空或仍然有原始值,或者如果用户已经输入。你可以很容易地将它适配到jQuery中,或者使用addEventListener、attachEvent或任何你需要的方式来支持你需要的浏览器。希望这对你有帮助!