JQuery:如何检查表单字段的值

JQuery: How to check the value of a form field

本文关键字:表单 字段 检查 何检查 JQuery      更新时间:2023-09-26

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

这是JSbin:http://jsbin.com/EvohEkO/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;
 }
}

这更容易一些。

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

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

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

要检查表单字段的值,请在输入元素上使用 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 工作链接

你可以像下面这样做!

<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>