Question

我有一个简单的html5 jquery移动代码，但我不知道如何收集值并提交。当我尝试收集值时，我会收到错误。请有人帮助我。我是JQuery Mobile的新手。

<div data-role="page"  id="location">

            <div data-role="header">
                <a href="#first" data-rel="back" data-role="button">Back</a> <h1>Second Page</h1>
            </div>

            <div data-role="content">       


            <label for="select-choice-0" class="select">Select Continent:</label>
                <select name="continent" id="continent" >
                   <option value="">Choose Your Continent</option>
                   <option value="Africa">Africa</option>
                   <option value="Asia">Asia</option>
                   <option value="Australia">Australia</option>
                   <option value="Europe">Europe</option>
                   <option value="North America">North America</option>
                   <option value="South America">South America</option>
                </select>


                <label for="select-choice-0">Select Country:</label>
                <select name="continent" id="country" >

                </select>




         <fieldset data-role="controlgroup" data-type="horizontal">
             <legend>Are you a member of Rhema Chapel?</legend>
        <input type="radio" name="radio-choice-h-2" id="radio-choice-h-2a" value="on" checked="checked">
        <label for="radio-choice-h-2a">One</label>
        <input type="radio" name="radio-choice-h-2" id="radio-choice-h-2b" value="off">
        <label for="radio-choice-h-2b">Two</label>
        <input type="radio" name="radio-choice-h-2" id="radio-choice-h-2c" value="other">
        <label for="radio-choice-h-2c">Three</label>


    </fieldset>
                            <a href="#" data-role="button" id="submitlocation">Next</a>     

            </div>


            <div data-role="footer">Footer of Page</div>

        </div>

Answer 1

$(document).on("pageinit", "#location", function(){
    $("#submitlocation").on("click", function(){        
      var form = {};

      // get all field values with their respective names to form an object
      $("[name]").each(function (i,ele) {
        form[$(ele).attr("name")] = $(ele).val();
      });

      // post it
      var req = $.post(some_url, JSON.stringify(form));
      req.done(function () {alert("success!")});
  });
});

Answer 2

这是 DEMO FIDDLE

对于jQuery Mobile，您将初始化代码放在其中一个页面事件中。在此示例中，我使用pageinit（http://api.jquerymobile.com/pageinit/）。您使用jQuery val（）函数来获取表单元素的值

$(document).on("pageinit", "#location", function(){
    $("#submitlocation").on("click", function(){
       var continent = $("#continent").val();
       var country = $("#country").val();
       var member = $('input:radio[name=radio-choice-h-2]:checked').val();

       alert('location: ' + continent + ' ' + country + ' ' + member);        
    });
});

以下是val（）的API文档：http://api.jquery.com/val/

收集值并提交值

2 个答案: