說明:
最近剛接了一個項目,其中有項目需求要求根據選擇不同店鋪選項,上送不同id值,展示不同商品列表
先給大家展示下實現效果圖:如果大家感興趣對此很感興趣,可以參考下實現代碼。
var formStr = "{'supplierId':'供應鏈企業|%-jm-sprt-%|93794498-3'}";$.ajax({type : "post",dataType : "json",cache : false,url : "../../../webservice/gmall.json", // 提交到一般處理程序請求數據data :"businessCode=61001001&message="+encodeURI(formStr).replace(//+/g, "%2B"),async : false,error : function() {//alert("connection error!!!");layer.alert("數據加載失敗,請及時聯系管理員!",0);},success : function(data) {var dataJson = strToJson(data.msg);var shopname = dataJson.body.gmPage;if(dataJson.head.status=='000000'){$.each(shopname,function(i,item){$("#store").append("<option id='"+item.id+"' value='"+item.shopType+"' title='"+item.name+"'>"+item.name+"</option>");})$("select").on('click',function (){var opt = $(this).children('option:selected');var shopId = $(opt).attr('id');var shopType = $(opt).val();var formStrshop = " {'shopId':"+shopId+",'shopType':"+shopType+"}";if($("option").val()==''){$("#tb").empty();}$.ajax({type : "post",dataType : "json",cache : false,url : "../../../webservice/gmall.json", // 提交到一般處理程序請求數據data :"businessCode=61001003&message="+encodeURI(formStrshop).replace(//+/g, "%2B"),async : false,error : function() {layer.alert("數據加載失敗,請及時聯系管理員!",0);},success : function(data) {var dataJson = strToJson(data.msg);var shopname = dataJson.body.gmPage;if(dataJson.head.status=='000000'){$.each(shopname,function(i,item){var attributeValue11 = dataJson.body.gmPage[i].attributeValue11;$("#tb").empty();$("#tb").append("<tr id='"+item.id+"'>" +"<td><input type='checkbox' value='"+item.id+"' name='price'/></td>"+"<td>"+item.sn+"</td>"+"<td>"+item.name+"</td>"+"<td>"+item.attributeValue11+"</td>"+"<td><input type='text' name='discount' class='text' style='width:100px'/></td>"+"<td>"+0+"</td></tr>"); })} }});})}}});
簡單示例
<select name="" id=""><option value="1" id="1">123</option><option value="2" id="2">gfg</option><option value="3" id="3">ds3</option><option value="4" id="4">1fgtr3</option><option value="5" id="5">6y3</option><option value="6" id="6">1fbnh3</option><option value="7" id="7">1vdf3</option></select><script src="jquery-1.8.2.min.js"></script><script>$(function(){$('select').on('click',function(){// $(this).on('click',function(){ 此步可省略,無需管option的點擊事件 var $opt = $(this).children('option:selected'); console.log($($opt).attr('id'),$($opt).val(),$($opt).html());// })})})</script>
以上所述是小編給大家介紹的jQuery添加options點擊事件并傳值實例代碼的相關知識,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對武林網網站的支持!
新聞熱點
疑難解答