jquery 打開窗口返回值實(shí)現(xiàn)代碼
更新時(shí)間:2010年03月04日 18:35:14 作者:
網(wǎng)頁(yè)上常常有這種效果,當(dāng)你的鼠標(biāo)移入一個(gè)輸入框時(shí)會(huì)彈出一個(gè)對(duì)話框讓你選擇填入該對(duì)話框的值,現(xiàn)在我們用Jquery簡(jiǎn)單的實(shí)現(xiàn)這種效果。
復(fù)制代碼 代碼如下:
<div>get value:<input type="text" name="inputname" id="inputname"/>
<div id="getvalue" style="display:none;">
<div id="tl"></div><div id="tr"></div>
<table style="border:1px solid #ccc ;width:500px;text-align:left;">
<thead>
<tr>
<th>number</th>
<th>last name</th>
<th>first name</th>
</tr>
</thead>
<tbody>
<tr>
<td>2</td>
<td>xing</td>
<td>ge</td>
</tr>
<tr>
<td>3</td>
<td>xingad</td>
<td>gead</td>
</tr>
<tr>
<td>4</td>
<td>xingxing</td>
<td>ge</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>number</td>
<td>last name</td>
<td>first name</td>
</tr>
</tfoot>
</table>
</div>
</div>
接下來我們寫點(diǎn)JS代碼實(shí)現(xiàn)這個(gè)功能:
復(fù)制代碼 代碼如下:
$(document).ready(function(){
$("#inputname").focus(function(){
//alert('focus');
$("#getvalue").css("display",'block')//顯示表格
.addClass('hover')
.find('table tr').dblclick(function(){//雙擊表格tr
var text=$(this).find("td:eq(0)").text();//獲取表格td的第一個(gè)的文本值
//alert($text);
$("#getvalue").css('display','none');//隱藏表格
$("#inputname").val(text);//賦值Input
});
});
})
相關(guān)文章
jQuery實(shí)現(xiàn)的分頁(yè)插件完整示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)的分頁(yè)插件,結(jié)合完整實(shí)例形式分析了jQuery分頁(yè)插件的定義與使用相關(guān)操作技巧,需要的朋友可以參考下2020-05-05
使用JQUERY進(jìn)行后臺(tái)頁(yè)面布局控制DIV實(shí)現(xiàn)左右式
一個(gè)網(wǎng)站的后臺(tái)使用frame框架來實(shí)現(xiàn)這種形式,這邊作者不是使用的frame而是純div進(jìn)行布局,下面看下具體的實(shí)現(xiàn)代碼2014-01-01
jQuery事件綁定on()與彈窗實(shí)現(xiàn)代碼
這篇文章主要介紹了jQuery事件綁定on()與彈窗實(shí)現(xiàn)代碼,需要的朋友可以參考下2016-04-04
jquery+h5實(shí)現(xiàn)九宮格抽獎(jiǎng)特效(前后端代碼)
這篇文章主要為大家詳細(xì)介紹了jquery+h5實(shí)現(xiàn)九宮格抽獎(jiǎng)特效,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-08-08
有關(guān)jQuery中parent()和siblings()的小問題
本文通過一個(gè)實(shí)例給大家介紹有關(guān)parent()和siblings()問題原因及解決方案,非常不錯(cuò)具有參考借鑒價(jià)值,感興趣的朋友一起看看吧2016-06-06
jQuery實(shí)現(xiàn)為table表格動(dòng)態(tài)添加或刪除tr功能示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)為table表格動(dòng)態(tài)添加或刪除tr功能,結(jié)合實(shí)例形式分析了jQuery針對(duì)table表格行動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2019-02-02
jquery實(shí)現(xiàn)不包含當(dāng)前項(xiàng)的選擇器實(shí)例
這篇文章主要介紹了jquery實(shí)現(xiàn)不包含當(dāng)前項(xiàng)的選擇器,實(shí)例分析了jquery選擇器的使用技巧,需要的朋友可以參考下2015-06-06
jQuery中innerHeight()方法用法實(shí)例
這篇文章主要介紹了jQuery中innerHeight()方法用法,實(shí)例分析了innerHeight()方法的功能、定義及獲取第一個(gè)匹配元素內(nèi)部區(qū)域高度的使用技巧,需要的朋友可以參考下2015-01-01

