2013-12-10 74 views
0

我有一个简单的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> 

回答

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!")}); 
    }); 
}); 
0

这里是一个DEMO FIDDLE

对于jQuery Mobile的,你把初始化代码在页面的事件之一。在这个例子中,我使用pageinithttp://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/