对于这样的小表格，我不会打扰使用插件-它甚至与jQuery Mobile兼容吗?无论如何，为了让您入门，这是一种在存在空白字段时阻止提交的简单方法:

$("#formL").submit(function() {

    // get a collection of all empty fields
    var emptyFields = $(":input.required").filter(function() {

        // $.trim to prevent whitespace-only values being counted as 'filled'
        return !$.trim(this.value).length;
    });

    // if there are one or more empty fields
    if(emptyFields.length) {

        // do stuff; return false prevents submission
        emptyFields.css("border", "1px solid red");   
        alert("You must fill all fields!");
        return false;
    }
});

> 您可以在此处尝试使用它. >

I have a mobile website and everything is working fine except for the validation. Basically I'm looking to take values from the user and then process them on a separate page (process.php). However, before doing so I need to check to make sure the fields have been populated. I have looked at several ways to do this but none seem to be working. I have the below code at the moment. When I press the process button it brings me through to the process.php splash screen even though the item field is empty. It doesn't write to the database but I would rather it didn't bring the user to the process.php screen until all mandatory fields have been filled in. Any ideas?

<script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/validate/jquery.validate.js"></script>

<script>
  $(document).ready(function(){
  $("#formL").validate(); });
</script>



<div data-role="content">

      <form id="formL" action="/website/process.php" method="post">
      <div data-role="fieldcontain">
        <label for="item">
        <em>* </em> <b>Item:</b> </label>
        <input type="text" id="item" name="item" class="required" />
      </div>

      <div class="ui-body ui-body-b">
        <button class="buttonL" type="submit" data-theme="a">Process</button>
      </div>
    </form>

</div>

For a small form like that, I wouldn't bother using a plugin - is it even compatible with jQuery Mobile? Anyway, to get you started, here's a simple way to prevent submission when there are empty fields:

$("#formL").submit(function() {

    // get a collection of all empty fields
    var emptyFields = $(":input.required").filter(function() {

        // $.trim to prevent whitespace-only values being counted as 'filled'
        return !$.trim(this.value).length;
    });

    // if there are one or more empty fields
    if(emptyFields.length) {

        // do stuff; return false prevents submission
        emptyFields.css("border", "1px solid red");   
        alert("You must fill all fields!");
        return false;
    }
});

You can try it/mess with it here.