jquery二級聯(lián)動,jquery二級聯(lián)動菜單
jquery如何動態(tài)產(chǎn)生二級聯(lián)動,就是點擊添加按鈕后產(chǎn)生一個二級聯(lián)動
二級聯(lián)動:
script
??????//點擊按鈕生成一級聯(lián)動
???$("button").on("click",function(){
???????var?oneSelect?=?"select?name='oneSelect'/select";
???????$("body").append(oneSelect);
???});
???//這里說明下,英文二級聯(lián)動是根據(jù)一級聯(lián)動來的,邏輯代碼看你自己了,因為
???//一級聯(lián)動是js動態(tài)生成的,再綁定事件涉及特殊方法live,而live這個方法1.8.3
???//jquery版本以后是廢棄的,所以要使用
???//$("select[name=oneSelect]").on("change","父級節(jié)點",fucntion(){});
???//根據(jù)你的一級聯(lián)動以及需求選擇觸發(fā)二級聯(lián)動
???$("select[name=oneSelect]").live("change",function(){
???????var?twoSelect?=?"select?name='twoSelect'/select";
???????$("body").append(twoSelect);
???});
/script
怎么用jquery實現(xiàn)二級聯(lián)動
你好!
下面是個簡單的小例子,僅供參考:
script?type="text/javascript"
$(document).ready(function(){
??var?data={
???????"liaoning":{
??????????"210100000000":"沈陽市",
??????????"210200000000":"大連市",
??????????"210300000000":"鞍山市"
???????},
???????"heilongjiang":{
??????????"230100000000":"哈爾濱市",
??????????"230200000000":"齊齊哈爾市",
??????????"230300000000":"雞西市"
???????}
??};
??$("#aa").change(function(){
??????if(this.value==0){
??????????$("#bb").empty();
??????}?else?{
??????????for(var?key?in?data){
??????????????if(key==this.value){
?????????????????$("#bb").empty();
?????????????????for(var?kkey?in?data[this.value]){
?????????????????????$("option?/").attr("value",kkey).text(data[this.value][kkey]).appendTo($("#bb"));
?????????????????}
??????????????}
??????????}
??????}
??});
});
/script
/head
body
select?id="aa"
??option?value="0"請選擇省/option
??option?value="liaoning"遼寧/option
??option?value="heilongjiang"黑龍江/option
/select
select?id="bb"
???
/select
/body
希望對你有幫助!
jq二級聯(lián)動怎么獲取選取值
1.首先將Id為province的添加class=“province”便于針對city隱藏
2.$("#province").on("change", function(){
var index = document.getElementById("province").selectedIndex;
$(".city:not(.city2)").hide();
$(".city2 option").eq(index).attr("selected",true);
});
selectedIndex即可獲取選中的行數(shù),根據(jù)行數(shù)聯(lián)動city2即可。
jQuery如何實現(xiàn)下拉框的二級聯(lián)動?
給你一個三級聯(lián)動的,你你參考一下
script language="JavaScript" type="text/javascript"
function createCode()
{
//數(shù)組賦值
var varname = new Array(4);
varname[0] = "請選擇";
varname[1] = "紅色";
varname[2] = "黃色";
varname[3] = "藍色";
//下拉框賦值
for(var i=0;i4;i++)
{
document.getElementById('xlk1').options[i] = new Option(varname[i],i);
}
copy();
}
//復(fù)制下拉框一給下拉框二
function copy()
{
for(i=0;idocument.getElementById("xlk1").options.length;i++)
{
document.getElementById('xlk2').options[i] = new Option(document.getElementById("xlk1").options[i].text,i)
}
copytwo();
}
//復(fù)制下拉框一給下拉框二
function copytwo()
{
for(i=0;idocument.getElementById("xlk2").options.length;i++)
{
document.getElementById('xlk3').options[i] = new Option(document.getElementById("xlk2").options[i].text,i)
}
}
function onChange1()
{
//獲取下拉框1的選中項
var strid=document.getElementById("xlk1").value;
//獲取選中項的內(nèi)容
//var strtxt=document.getElementById("xlk1").options[window.document.getElementById("xlk1").selectedIndex].text;
//獲取指定ID下拉框的項總數(shù)
//var strnub=document.getElementById("xlk1").options.length;
copy();
if(strid != 0)
{
document.getElementById("xlk2").options.remove(strid);
document.getElementById("xlk3").options.remove(strid);
}
document.getElementById("textfield").value=strid+strtxt+strnub;
}
function onChange2()
{
//獲取下拉框1的選中項
var strid2=document.getElementById("xlk2").selectedIndex;
//獲取選中項的內(nèi)容
var strtxt2=document.getElementById("xlk2").options[window.document.getElementById("xlk2").selectedIndex].text;
//獲取指定ID下拉框的項總數(shù)
var strnub2=document.getElementById("xlk2").options.length;
copytwo();
if(strid2 != 0)
{
document.getElementById("xlk3").options.remove(strid2);
}
}
/script
body onLoad="createCode()"
form id="form1" name="form1" method="post" action=""
select name="xlk1" id="xlk1" onChange="onChange1()"/select
select name="xlk2" id="xlk2" onChange="onChange2()"/select
select name="xlk3" id="xlk3"/select
/form
jquery 二級聯(lián)動 select 無法選中 option
乍一看你代碼有很多小細節(jié)上的不規(guī)范,也不知道是粘貼上來少了,我改下你php頁
select只能有1個option有selected屬性,如果多個都有,只會落在最后1個上
?php
//這是jQuery里load的這個頁面
include('loginis.php');
include('../include/db_class.php');
//數(shù)據(jù)庫操作,根據(jù)情況換成自己的數(shù)據(jù)操作
$fid=intval($fid);
$resultclass=$db-query("select * from ${dbpre}productclass where id='$fid' and sid0 order by position asc");
echo "select id='sid' name='sid'";
echo"option value=''請選擇/option";
while($type=$db-getarray($resultclass)){
echo "option value='$type[sid]' ".( $type['sid'] == 3?"selected":"" )."$type[name]/option";
}
echo "/select";
?
上一篇:jquery數(shù)組創(chuàng)建,jquery 數(shù)組
欄 目:其它綜合
本文標題:jquery二級聯(lián)動,jquery二級聯(lián)動菜單
本文地址:http://mengdiqiu.com.cn/a1/qitazonghe/17138.html
您可能感興趣的文章
- 04-02jquery數(shù)組創(chuàng)建,jquery 數(shù)組
- 04-02jquery點擊,jquery點擊隱藏顯示事件
- 04-02jquery的hover,jquery概述
- 04-02jquery$不起作用,為什么jquery不執(zhí)行
- 04-02jquery與jsp,用jquery
- 04-02jquery點擊展開,js點擊展開
- 04-02jquery步驟,jquery方法
- 04-02小程序jquery,小程序開發(fā)公司
- 04-02圖片jquery,圖片頭像


閱讀排行
本欄相關(guān)
- 04-02android傳智播客,傳智播客官網(wǎng)
- 04-02android發(fā)展前景,android前景分析
- 04-02android屏幕適配,android屏幕適配 大廠
- 04-02android說明,android csdn
- 04-02android連接網(wǎng)絡(luò),安卓網(wǎng)絡(luò)連接
- 04-02android素材,手機 素材
- 04-02線程池android,線程池拒絕策略有哪些
- 04-02android環(huán)境,android環(huán)境變量配置SDK
- 04-02android短信驗證碼,android免費的短信驗
- 04-02騰訊手機管家forandroid,騰訊手機管家新
隨機閱讀
- 08-05DEDE織夢data目錄下的sessions文件夾有什
- 01-10C#中split用法實例總結(jié)
- 08-05dedecms(織夢)副欄目數(shù)量限制代碼修改
- 01-10SublimeText編譯C開發(fā)環(huán)境設(shè)置
- 01-11ajax實現(xiàn)頁面的局部加載
- 01-10delphi制作wav文件的方法
- 04-02jquery與jsp,用jquery
- 08-05織夢dedecms什么時候用欄目交叉功能?
- 01-11Mac OSX 打開原生自帶讀寫NTFS功能(圖文
- 01-10使用C語言求解撲克牌的順子及n個骰子