自動填充jQueryMobile選擇

我想知道我無法從網絡ob獲得任何有價值的資源。我對以下選擇選項進行了編碼，並堅持使用新選項重新構建Jquery移動版中的第二個選項。我相信有人可以幫助做到這一點。我非常感謝你們，希望能幫助我。自動填充jQueryMobile選擇

<meta name="viewport" content="width=device-width, initial-scale=1"> 

<link rel="stylesheet" href="jquery.mobile.structure-1.0.1.css" /> 
<link rel="stylesheet" href="jquery.mobile-1.0.1.css" /> 
<link rel="stylesheet" href="custom.css" /> 

<script src="js/jquery-1.7.1.min.js"></script> 
<script src="js/jquery.mobile-1.0.1.min.js"></script>

腳本

<script type="text/javascript" charset="utf-8"> 
    $(document).ready(function() { 
     $("#cat").selectmenu(); // Initializes 
     $("#cat").selectmenu('refresh', true); 
     $("#cat").change(function() { 
      //document.write("asd");.selectmenu('refresh', true); 
     $("#subcat").load("datadmin/getsub.php?cat="+ $("#cat").val()); 
     var myselect = $("#subcat"); 
     myselect[0].selectedIndex = 3; 
     myselect.selectmenu("refresh"); 
     //$("#subcat").selectmenu('refresh', true); 
     });   
    }) 
</script>

的選擇

<div data-role="fieldcontain" class="ui-field-contain ui-body ui-br"> 
    <label for="cat" class="select">Category:</label> 
<select name="cat" id="cat" data-mini="true"> 
<?php 
    $q="select * from cat"; 
    $res=mysql_query($q); 
    if(mysql_num_rows($res)>=1) 
    { 
     while ($info=mysql_fetch_array($res)) 
      { 
     echo '<option value="'.$info['cid'].'">'.$info['cat'].'</option>'; 
     } 
    } 
    ?> 
</select> 
</div> 

<div data-role="fieldcontain" class="ui-field-contain ui-body ui-br"> 
    <label for="subcat" class="select">Sub Category:</label> 
<select name="subcat" id="subcat" data-mini="true"> 
<?php 
    $q="select * from subcat"; 
    $res=mysql_query($q); 
    if(mysql_num_rows($res)>=1) 
    { 
     while ($info=mysql_fetch_array($res)) 
      { 
     echo '<option value="'.$info['sid'].'">'.$info['subcat'].'</option>'; 
    } 
    } 
?> 
</select> 
</div>

這是的jsfiddle連結此代碼jsfiddle.net/abelkbil/wLC65

來源

2013-07-12 Abel Jojo

你能爲此做一個jsfiddle嗎？ – krishgopinath

http://jsfiddle.net/abelkbil/wLC65/ jsfiddle鏈接。 –

謝謝@hungerpain。供您考慮。 –

不幸的是，在你的代碼犯規的load方法因爲該網址不在您的網域中。這被稱爲跨域調用，並且不允許被XMLHttpRequest（這是後面的load所做的）。避免這種情況的一種方法是向服務器中的方法發出ajax請求，然後將轉換爲此URL並從中獲取數據。所以在你的change功能，

$("#cat").bind("change", function() { 
     alert("change"); 
     //$("#subcat").load("http://fortunebitsolutions.com/olx/dataadmin/getsub.php?cat=" + $("#cat").val());<--This wont work.ajax doesnt allow cross domain requests 

     //get a response from this url from your server, and make an ajax request to your server to get it from there. 
     /* $.ajax({ 
       url: url to server method, 
       data: { "cat": this.value }, 
       jsonp: true, 
       success: function (s) { 
        //now s will contain options. 
        $options = s; 
       }, 
       error: function (s) { 
        alert("error"); 
       } 
      }); */ 

     //now add the options to second select 
     $("#subcat").html($options).selectmenu().selectmenu('refresh', true); 
    });

下面是一個離線例如演示：http://jsfiddle.net/hungerpain/wLC65/1/

PS：如果你從一個.NET的背景是，請在作出該服務器端隨時問我的幫助代碼:)

來源

2013-07-13 07:19:36 krishgopinath

我感謝你@hungerpain –

請標記答案爲正確的答案，如果你認爲這有助於你:) – krishgopinath

當然。這對我幫助很大 –

自動填充jQueryMobile選擇

回答

相關問題