JQuery：如何检查表单字段的值答案

【问题标题】：JQuery: How to check the value of a form fieldJQuery：如何检查表单字段的值
【发布时间】：2013-11-11 03:27:21
【问题描述】：

我有一个简单的表格，有一个问题。在资源管理器中，如果没有插入任何内容，则将占位符作为字段的输入传递。

这里是 JSbin：http://jsbin.com/EvohEkO/1/

我想做一个简单的比较，当提交表单时，检查字段的值是否等于“名字”，如果是，则将值留空“”

正是我需要的。有人可以帮帮我吗？

【问题讨论】：

共有三个字段。但是例如我们可以检查名字的值。 id 为“fname”，占位符值为“First name”。

标签： javascript jquery forms placeholder

【解决方案1】：

<form onsubmit="return checkform()">
    <input name="test" placeholder="placeholdertext" id="test" />
    <input type="submit"  value="submitbutton"/>
</form>

在js中

你应该导入 jquery 最新版本，这是链接：http://code.jquery.com/jquery-1.10.2.min.js

function checkform(){
 var fieldvalue = $.trim($('#test').val());
 if(!fieldvalue || fieldvalue=="placeholdertext"){
   alert('there is no input');
   return false;
 }else{
   alert('enjoy your form!');
   return true;
 }
}

【讨论】：

谢谢楼主！我看到逻辑是有效的！最后一件事，只是为了确定：我怎样才能使字段的值等于“”而不是警报？
只需执行$('#test').val('') 将值设置为""

【解决方案2】：

这有点容易..

$(document).ready(function(){
    $("#form").submit(function(){
        $('#form input:text, textarea').each(function() {
            if($(this).val()==$(this).attr('placeholder'))
                $(this).val(" ");
        });
    });
});

【讨论】：

【解决方案3】：

只需将您的字段值放入隐藏类型输入中，如下所示：-

<input id="hdnfield" name="hdnfield" value="<Your Field Value>" />

【讨论】：

【解决方案4】：

要检查表单字段的值，请在输入元素上使用 val() 函数

var input_value = jQuery('Input Element Selector').val();

当我查看您的表单时，元素没有任何 id 属性，我建议您为每个元素添加一个，还将提交输入更改为按钮，您可以更好地控制 javascript。所以你的表格看起来像：

<form id="form" action="form.php" method="post">
   <input id="fname" type="text" placeholder="First name" name="fname"><br>
   <label for="fname" id="fnamelabel"></label>
   <input id="lname"type="text" placeholder="Last name" name="lname"><br>
   <textarea id="message" placeholder="Contact us!" cols="30" rows="5" name="message"></textarea><br>
   <br>
   <input type="button" value="Submit">

</form>

所以你的 jQuery 看起来像：

jQuery(document).ready(function(){
    jQuery('input[type="button"]').click(function(){
        var fname = jQuery('#fname').val();
        var lname = jQuery('#lname').val();
        var message = jQuery('#message').val();
        ...... Do whatever you need & then change the input values
        ...... if all validation has passed the use jQuery('#form').submit(); to submit the form otherwise reset the form:
        jQuery('#fname').val("");
        jQuery('#lname').val("");
        jQuery('#message').val("");



    });
});

这是一个工作版本： jsfiddle working link

【讨论】：

【解决方案5】：

你可以这样做！

<form>
   <input type="text" id="first_name" name="first_name"/>
   <input type="submit" id="submit" value="submit"/>
</form>

<script type="type/javascript"/>
jQuery.noConflict();
(function ($) {
    $(function () {
        $("#submit").click(function () {
             if ($("#first_name").val() == "first name") {
                 $(this).val("");
             }
         });
     });
 })(jQuery);
</script>

【讨论】：