1.實際中自己遇到的，比較雜亂

• • 綁定點擊事件
  • 綁定enter事件
  • html A頁面跳轉到B頁面，并傳參、取值
  • layui模板引擎，渲染樣式
  • • • Ajax 異步傳輸數據，動態更新內容

綁定點擊事件

<input id ="button" type="button" value="搜搜" /> $("#button").click(function () {//#button 是點擊按鈕的id//執行自己需要的操作； });

jquery中的$("#id")與document.getElementById(“id”)的區別，請看以下鏈接

https://www.cnblogs.com/theWayToAce/p/5591221.html

綁定enter事件

<input id ="inputid" type="text" value="" placeholder="請輸入內容" /> $(function(){ $('#inputid').bind('keypress',function(event){if(event.keyCode == "13") { //執行對應的操作} });});

html A頁面跳轉到B頁面，并傳參、取值

在A頁面在需要跳轉的方法、操作寫如下

window.location.href = 'B.html?value=123';

在B對應的地方取值：1

var value = $.query.get("value");//需要 jquery.params.js 包，下載地址可自行百度，或者隨后上傳

取值：2

https://blog.csdn.net/qq_41485414/article/details/79577879

layui模板引擎，渲染樣式

//布局 <div id="div1"> <script id="sc1" type="text/html">//渲染時值對應的位置，在對應的位置取值<div>{{# layui.each(d.List, function(index, item){ }}{{item.key}}{{# }); }}</div> </script> </div> //渲染代碼 //data 是需要渲染的數據 layui.laytpl($("sc1").html()).render(data, function(html){$("#div1").html(html)});

渲染的方法，寫在了頁面加載時就運行的地方，當打開頁面或者刷新的時候機會去導入的data參數讀取內容，進行遍歷等操作，以及渲染樣式。

Ajax 異步傳輸數據，動態更新內容

var url ="###"; $.ajax({url: url,data:{"A":'A',"B":'b',"c":'c'},type: "POST",dataType: "json",success: function(data) {//第一次加載頁面，此處不會報錯，往后便會報錯//layui.laytpl(.....).render(...)......not a function layui.laytpl($("sc1").html()).render(data, function(html){$("#div1").html(html)});}});

經過分析，當第一次頁面加載，刷新的時候 $(“sc1”).html() 得到了樣式，但是當異步加載完成后，渲染的時候 $(“sc1”).html() 此方法得到的 untified ，無法調用render方法，就得到了以上的報錯信息。
我的解決方法是，第一次加載的時候，將 $(“sc1”).html() 得到的樣式保存在全局變量，以后異步加載的使用即可，目前測試正常，（不太了解這塊內容，此方法可能不合規矩，）

ajax異步傳輸遇到的問題
問題描述：
一個點擊事件執行兩個ajax方法，第一個方法存儲，第二個讀取，向后臺訪問兩次，后臺加了Debug和沒加Debug返回的結果不同；
原因：
方法一：做的是存儲操作，需要修改數據庫對應的表
方法二：做的是讀取操作
異步傳輸的時候兩個方法互不干涉，雖然調用的時候有順序 ，上下位置，但是也會各自執行，可能也是同時執行，方法一還未執行完畢存儲操作，方法二就可能已經執行完了讀取的操作，導致方法二讀不到方法一入庫的數據，記為A結果，如果方法一執行完畢，方法二在讀取，記為B結果,此時極大可能AB不同;如果在方法二讀取數據庫過程中debug，方法一很有可能已經執行完畢，方法二讀取的內容便是最新的（包含方法一入庫的數據）
解決：如果想要互相影響，加上ajax的異步屬性async: false即可

以上內容不專業，只是個人的淺顯的理解，存在錯誤的觀點 還望高手指點

總結

以上是生活随笔為你收集整理的html 开发中遇到的问题，ajax异步传输，layui模板引擎并重新渲染的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。