传媒视频在线,99精品久久只有精品

本文實(shí)例為大家分享了Ajax實(shí)現(xiàn)表格中的信息進(jìn)行更新數(shù)據(jù)，供大家參考，具體內(nèi)容如下

html:

!DOCTYPE html>
html lang="en">
head>
 meta charset="UTF-8">
 title>Title/title>
 script type="text/javascript" src="jslib/jquery-3.1.1.js">/script>
 script type="text/javascript" src="jslib/edit.js">/script>
 link type="text/css" href="css/edit.css" rel="external nofollow" rel="stylesheet">/head>
 
/head>
body>
 table>
  tbody>
   tr>
    td>1111/td>
    td>2222/td>
   /tr>
   tr>
    td>3333/td>
    td>4444/td>
   /tr>
  /tbody>
 /table>
/body>
/html>

css:控制單根邊框

/*利用table和tr中的空隙來(lái)進(jìn)行控制間隙的顏色*/
table{
 border: 0px;
 background: #000;
}
tr{
 background: #FFF;
}

js:

//在頁(yè)面裝載的時(shí)候進(jìn)行對(duì)td的點(diǎn)擊
$(document).ready(function () {
 var tds = $("td");
 tds.click(tdclick);
});
function tdclick() {
  //1將文本的內(nèi)容保存起來(lái)
  var td = $(this);
  var text = td.text();
  //2清空td里面的內(nèi)容
  td.html("");
  //3建立文本框
  var input = $("input>");
  //4.設(shè)置文本框的值是保存起來(lái)的值
  input.attr("value", text);
  //4.5相應(yīng)回車(chē)和鍵盤(pán)事件
  input.keyup(function (event) {
   //判斷按鍵是什么
   var myevent = event || window.event;
   var key = myevent.keyCode;
   if (key == 13) {
    var inputnode = $(this);
    //1.保存文本框的內(nèi)榮
    var inputtext = inputnode.val();
    //2.清空td里面的內(nèi)容保存的文本框填充到td中去
    var tdNode = inputnode.parent();
    tdNode.html(inputtext);
    //4.讓td重新?lián)碛悬c(diǎn)擊事件
    td.click(tdclick);
   }
  });
  //5將文本框加入到td中
  td.append(input);
  //6為了防止td的點(diǎn)擊事件，我們可以移除
  td.unbind("click");
}

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

bootstrapTable+ajax加載數(shù)據(jù) refresh更新數(shù)據(jù)
Vue.js 通過(guò)jQuery ajax獲取數(shù)據(jù)實(shí)現(xiàn)更新后重新渲染頁(yè)面的方法
Vue2.X 通過(guò)AJAX動(dòng)態(tài)更新數(shù)據(jù)
jquery+ajaxform+springboot控件實(shí)現(xiàn)數(shù)據(jù)更新功能
利用jQuery及AJAX技術(shù)定時(shí)更新GridView的某一列數(shù)據(jù)
jquery ajax 局部無(wú)刷新更新數(shù)據(jù)的實(shí)現(xiàn)案例
Ajax異步無(wú)刷新對(duì)局部數(shù)據(jù)更新
ajax頁(yè)面無(wú)刷新 IE下遭遇Ajax緩存導(dǎo)致數(shù)據(jù)不更新的問(wèn)題
ajax異步刷新實(shí)現(xiàn)更新數(shù)據(jù)庫(kù)
ajax更新數(shù)據(jù)后，jquery、jq失效問(wèn)題

標(biāo)簽：內(nèi)江衡陽(yáng) 邯鄲樂(lè)山婁底德陽(yáng) 黔東海南

巨人網(wǎng)絡(luò)通訊聲明：本文標(biāo)題《Ajax實(shí)現(xiàn)表格中信息不刷新頁(yè)面進(jìn)行更新數(shù)據(jù)》，本文關(guān)鍵詞 Ajax,實(shí)現(xiàn),表格,中,信息,；如發(fā)現(xiàn)本文內(nèi)容存在版權(quán)問(wèn)題，煩請(qǐng)?zhí)峁┫嚓P(guān)信息告之我們，我們將及時(shí)溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡(luò)，涉及言論、版權(quán)與本站無(wú)關(guān)。