如何使用jquery mobile动态创建单选按钮？

Question

使用for循环条件动态创建单选按钮时，单选按钮不会创建。我下面的代码是

Polldetails.html

 <div data-role="content" class="pollsdetailsscreen"> 
      <p>Polls details page with radio buttons created dynamically.</p> 
     </div> 
     <div> 
      <ul id="radiopolls" data-theme="e" > 
      </ul> 
      comments:<textarea name="pollscomments" id="pollscomments"></textarea> 
      <div data-role="content" > 
       <a href="#" data-role="button" style="width: 100px;float:right">Submit</a> 
      </div> 
     </div> 

Polldetails.js

 var pollsDetails = function pollsDetails(){ 

//for(var i=0;i<4;i++) 
// { 
//var radiobutton = document.createElement('label'); 
//radiobutton.innerHTML="<input type='radio' name='hello'>hii000"; 
// $('#radiopolls').prepend(radiobutton).trigger('create'); 
// } 


for(var i=0; i<4; i++) 
    { 
     if(data.type == "poll") 
      { 
          console.log("this is polls page"); 
          //here i need to create four radio buttons dynamically based on below **data** options. 
      } 
     else if(data.type == "review") 
      { 
       console.log("this is reviews page");    
      }      
    } 
    } 



     var data = { 
     type:"poll", 
     question : "How are you?", 
     options : [{ 
      type : "radio", 
      name: "radioTest", 
      text: "Good" 
     }, 
     { 
      type:"radio", 
      name: "radioTest", 
      text: "Fine" 
     }, 
     { 
      type:"radio", 
      name: "radioTest2", 
      text: "Nice" 
     }, 
     { 
      type:"radio", 
      name: "radioTest2", 
      text: "V Nice" 
     }, 
     { 
      type:"checkbox", 
      name:"check", 
      text:"This is a check box" 
     }, 
     { 
      type:"textarea", 
      name:"comments", 
      text:"Comments Please" 
     }  
     ] 
    }; 

作为每代码通过检查条件，我需要动态地创建4个单选按钮时的条件是data.type =“民意调查”，但我无法动态创建基于代码的单选按钮..任何人都可以请帮我这个..........

Answer 1

请注意，您无法为单个表单值混合和匹配单选按钮和其他输入类型。通过给4个单选按钮命名两个不同的名字，你基本上创造了两个单独的问题，每个问题有两个答案。我敢肯定，下面的代码将不会产生正是你想要的，但它应该让你远远不够，你可以只调整它，因为你需要：

if (data.type === 'poll') { 
    var poll = {}; 
    for (optionIndex = 0; optionIndex < data.options.length; optionIndex++) { 
     var option = data.options[optionIndex]; 
     if (option.type === 'radio') { 
      var fieldset = poll[option.name]; 
      if (!fieldset) { 
       poll[option.name] = fieldset = $('<fieldset data-role="controlgroup">'); 
       fieldset.append($('<legend>').html(data.question)); 
      } 

      var answerID = 'poll-answer-' + (optionIndex + 1); 
      fieldset.append($('<input type="radio" />').attr('name', option.name).attr('value', option.text).attr('id', answerID)); 
      fieldset.append($('<label>').attr('for', answerID).html(option.text)); 
     } 
    } 

    var containerElement = $('#radiopolls'); 
    for (answerSet in poll) { 
     poll[answerSet].appendTo(containerElement).trigger('create'); 
    } 
} 

如果您需要任何帮助适应它，只是问。祝你好运！