javascript - 使用 jquery 加载时同时动态设置不同 HTML 页面的按钮文本

Question

我有两个 HTML 页面，我使用 jquery 在第一页中加载第二页。我想在加载时动态设置第二页中存在的按钮文本。

代码:

                $("#SerachForTruckTD").load("SearchBox.html");

                if(parsedOBJ.KIOSKTYPE == "THRU"){

                    $('#submitTruckPass').val('name1');
                    }
                    else if(parsedOBJ.KIOSKTYPE == "EX"){
                    $('#submitTruckPass').val('name 2');
                    } 

我认为这里的问题是，当代码到达要设置按钮文本的位置时，页面尚未加载。因为在设置按钮文本之前设置超时效果很好:

                setTimeout(() => {
                    if(parsedOBJ.KIOSKTYPE == "THRU"){

                    $('#submitTruckPass').val('name1');
                    }
                    else if(parsedOBJ.KIOSKTYPE == "EX"){
                    $('#submitTruckPass').val('name2 ');
                    } 

                }, 1000); 

但我的想法是，我想在加载页面时同时设置按钮文本，而不是在一秒钟之后。有解决办法吗？

非常感谢任何帮助!

Answer 1

执行此操作的最佳方法可能是使用 AJAX 获取文件，进行替换，然后添加它:

$.ajax({url: "SearchBox.html", success: function(result){
 var value;
 if(parsedOBJ.KIOSKTYPE == "THRU"){
  value = "name1"
 }else if(parsedOBJ.KIOSKTYPE == "EX"){
  value = "name 2"
 };
 var insert = $(result).find("#submitTruckPass").val(value);
 $("#SearchForTruckTD").append(insert);
}});