Question

我正在构建一个页面，其中显示了商店的分支列表第一个分支是必需的，因此其字段在页面中是硬编码的如果用户在数据库中有更多分支，则页面将在加载时构建必要的行所以，如果这是我目前的代码：

<html>
<head>
<script type="text/javascript">
    function initialize(){
        $.ajax({
            type: "POST",
            url: "ajaxCalls.php",
            dataType: "json",
            data: ({'storeId' : storeId}),
            success: function(storeBranches){
            ...
            }
        });
    }
</script>
</head>

<body onload="initialize()">  
<table>
    <tr>Main Branch:</tr>
    <tr>
    <th>Branch Name</th>
    <th>Branch Address</th>
    </tr>
    <tr>
    <td><input id="firstName" type="textbox" value=""></td>
    <td><input id="firstAddress" type="textbox" value=""></td>
    </tr>
</table> 

<br/>

<table border="1" cellspacing="10">
    <tr>Secondary Branches:</tr>
    ...

我有两个问题：

在使用ajax调用获取branches数组后，如何将数组中第一个元素的名称和地址传递给正文中的字段（firstName和firstAddress）？
如何根据数组中的分支数量动态创建其他行（当然，第一个分支为-1）并使用名称和地址信息填充它们？

Answer 1

为了将值插入“firstName”和“firstAddress”，您需要使用javascript获取它们。如果你在上面的例子中使用jQuery，那么简单的$('#firstName')[0].value = "YourValue";就可以了。
在jQuery中动态创建DOM元素也很容易：你需要将它插入到另一个元素中（在你的例子中 - 页面的主体）。它就像$(document.body).append('<table><tr><td>Branch Name:</td><td>' + yourBranchName + '</td></tr></table>');一样，因为HTML是一个字符串，你可以将自己的数据插入其中（比如'<input name="branchName7" value="' + yourSeventhBranchName + '" />'当然你需要清理你的字符串。更多信息在这里：http://api.jquery.com/category/manipulation/dom-insertion-inside/ < / p>

如何使用ajax会导致html页面的不同部分

1 个答案: