2012-03-14 166 views
0

我已要求下面的脚本form.php的http://pastebin.com/kHiZ3gLY(我已经粘贴了以下完整的脚本)PHP脚本忽略输入占位符的文本字段

当我完成了第一套4场(保留另一2套他们的占位符文本),并提交,我的var_dump输出为:

string '1|1|1|1 

Height (cm)|Width (cm)|Length (cm)|Weight (kg) 

Height (cm)|Width (cm)|Length (cm)| 

' (length=133) 

是否有可能,我可以用PHP/jQuery来“忽略”,已到位的占位符的文本字段?所以我的输出只是:

string '1|1|1|1' (length=7) 

非常感谢任何帮手在这里。

完整的脚本:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US"> 

<head profile="http://gmpg.org/xfn/11"> 

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<title>March 2012 Experiment</title> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script> 

<script src="http://digitalbush.com/files/jquery/watermarkinput/beta1/jquery.watermarkinput.js" type="text/javascript"></script> 

<script type="text/javascript"> 
jQuery(function($){ 
    $("#p1height").Watermark("Height (cm)"); 
    $("#p1width").Watermark("Width (cm)"); 
    $("#p1length").Watermark("Length (cm)"); 
    $("#p1weight").Watermark("Weight (kg)"); 
    $("#p2height").Watermark("Height (cm)"); 
    $("#p2width").Watermark("Width (cm)"); 
    $("#p2length").Watermark("Length (cm)"); 
    $("#p2weight").Watermark("Weight (kg)"); 
    $("#p3height").Watermark("Height (cm)"); 
    $("#p3width").Watermark("Width (cm)"); 
    $("#p3length").Watermark("Length (cm)"); 
    $("#p3weight").Watermark("Weight (kg)"); 
}); 
</script> 


</head> 

<body> 

<?php 

$errors = ''; 

if (isset($_POST['submitform'])) { 

    $ierrors = array(); 
    $all = ''; 

    // Loop over the values 1 through 3 
    foreach(range(1, 3) as $i) 
    { 
     // Create an array that stores all of the values for the current number 
     $values = array( 
      'p' . $i . 'height' => $_POST['p' . $i . 'height'], 
      'p' . $i . 'width' => $_POST['p' . $i . 'width'], 
      'p' . $i . 'length' => $_POST['p' . $i . 'length'], 
      'p' . $i . 'weight' => $_POST['p' . $i . 'weight'] 
     ); 

     // Validate every value 
     foreach($values as $key => $value) 
     { 
      if(empty($value)) 
      { 
       $ierrors[] = "Value $key is not set"; 
      } 
      // You can add more validation in here, such as: 
      if(!is_numeric($value)) 
      { 
       $ierrors[] = "Value $key contains an invalid value '$value'"; 
      } 
     } 

     // Join all of the values together to produce the desired output 
     $all .= implode('|', $values) . "\n\n"; 
    } 

    var_dump($all); 

} 

?> 

<form action="form.php" method="post"> 

    <input type="text" id="p1weight" name="p1weight" value="" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;" /> 
    <input type="text" id="p1length" name="p1length" value="" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;" /> 
    <input type="text" id="p1width" name="p1width" value="" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;" /> 
    <input type="text" id="p1height" name="p1height" value="" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;" /> 

    <p>&nbsp;</p> 

    <input type="text" id="p2weight" name="p2weight" value="" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;" /> 
    <input type="text" id="p2length" name="p2length" value="" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;" /> 
    <input type="text" id="p2width" name="p2width" value="" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;" /> 
    <input type="text" id="p2height" name="p2height" value="" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;" /> 

    <p>&nbsp;</p> 

    <input type="text" id="p3weight" name="p3weight" value="" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;" /> 
    <input type="text" value="" id="p3length" name="p3length" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;" /> 
    <input type="text" value="" id="p3width" name="p3width" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;" /> 
    <input type="text" id="p3height" name="p3height" value="" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;" /> 

    <p>&nbsp;</p> 

    <input type="submit" name="submitform" id="submitform" /> 

</form> 

</body> 

</html> 

回答

1

此问题是您不应使用占位符文本填充表单字段的值属性的很多原因之一。如果你想拥有占位符文本,我建议你可以看看some javascript to overlay label元素或查看HTML5 placeholder attribute

要真正回答你的问题,你可以使用JavaScript提交事件过滤表单字段提交之前发生。像这样的东西应该让你开始。

$(function(){ 
    $('form').submit(function(){ 
     $('input[type=text]', this).each(function(){ 
      if (this.value == this.defaultValue) this.value = ''; 
     }); 
    }); 
}); 
+0

非常感谢您的回复。你能确切地确认我应该把这个放在我的javascript代码中吗? – michaelmcgurk 2012-03-14 08:56:50

+1

在你的问题的代码中,你可以把它放在'jQuery'(函数($){'。 – drzax 2012-03-14 09:27:12

+0

)非常感谢,drzax。刚刚尝试... – michaelmcgurk 2012-03-14 09:58:01

0

HTTP不张贴禁用输入。尝试禁用表单提交时的输入,以便它不会发布到服务器。

+0

感谢您的回答。是否有机会提供代码示例(使用我的代码)来说明您的答案?我不完全确定从哪里开始。谢谢:) – michaelmcgurk 2012-03-14 07:29:31