Question

我的javascript函数被调用但是参数没有被传递。如何将参数传递给javascript函数。

我的要求

我需要在从数据库加载页面时动态生成行。我还需要在单击添加按钮时动态添加行。生成行但我无法将相应的值附加到列。任何人都可以发布代码？任何帮助都会非常值得注意我是javascript的新手

这是我的代码......

我的HTML

<div class="systemset">
    <!-- table table-hover table-striped  table-bordered table-highlight-head-->
    <table id="systemsettingstid" class="table-bordered table-striped">
        <thead class="tax_thead" id="tdDetailList">
        <tr>

            <th width="200" id="code" title="Code">Code</th>
            <th width="200" id="from" title="from ">from</th>
            <th width="200" id="to" title="to">to</th>
            <th width="50" id="del" title="del">del</th>

        </tr>
        </thead>
    </table>

</div>
<div>

    <c:forEach var="item" items="${rateperiod_attribute}">
        <c:out value="code: ${item.code}"/>
        <c:out value="from:${item.fromDate}"></c:out>
        <c:out value="to:${item.toDate}"></c:out>
        <script> addRow("systemsettingstid", "code", "from", "to") </script>
    </c:forEach>
    <script type="text/javascript">
        var code = null;
        var from = null;
        var to = null;
    </script>
    <button type="button" onClick="javascript:addRow('systemsettingstid','code','from','to');">Add</button>
</div>

Javascript功能

<script type="text/javascript">

    function addRow(tableId, code, from, to) { //Add new row to given table having id tableId

        var table = document.getElementById(tableId);

        var rowCount = table.rows.length;
        var row = table.insertRow(rowCount);
        var cell1 = row.insertCell(0);
        var cell2 = row.insertCell(1);
        var cell3 = row.insertCell(2);
        var cell4 = row.insertCell(3);//value=\"+code+\
        cell1.innerHTML = '<input type="text" id="code' + rowCount + '" name="code" maxlength="16" value=\"+code+\ />';
        cell2.innerHTML = '<input type="hidden" id="dp3' + rowCount + '" name="id" value="<c:out value="${item.id}"/>" />            <input type="date" id="dp3' + rowCount + '" class="" name="validFrom" maxlength="50" value="<fmt:formatDate pattern="yyyy-MM-dd" value="${item.validFrom}" />">';
        $('.datepicker').datepicker({
            format: 'yyyy-mm-dd'
        });
        cell3.innerHTML = '<input type="hidden" id="dp3' + rowCount + '" name="id" value="<c:out value="${item.id}"/>" />            <input type="date" id="dp3' + rowCount + '" class="" name="validFrom" maxlength="50" value="<fmt:formatDate pattern="yyyy-MM-dd" value="${item.validFrom}" />">';
        $('.datepicker').datepicker({
            format: 'yyyy-mm-dd'
        });

        cell4.innerHTML = '<a id="del3'
            + rowCount
            + '" href="javascript:deleteRow(\'systemsettingstid\', document.getElementById(\'del3'
            + rowCount + '\'));" class="delete_row"></a>';

    }

    function deleteRow(tableId, element) {    //Delete row of a given table
        var result = confirm('<spring:message code="message.delete.confirm" />');
        if (result == true) {
            var table = document.getElementById(tableId);
            var row = element.parentNode.parentNode.rowIndex;
            table.deleteRow(row);
        }
    }


</script>

Answer 1

使用以下代码帮助

<c:forEach var="item" items="${rateperiod_attribute}">

 <script type="text/javascript">
        var code = '${item.code}';
        var from = '${item.fromDate}';
        var to =   '${item.toDate}';

        addRow("systemsettingstid", code, from, to);
    </script>
</c:forEach>

提供最终的系统设置

Answer 2

在服务器端脚本文件 my HTML 中，您可以编写如下：

<script type="text/javascript">
    addRow('<c:out value="${tableId}"/>', '<c:out value="${code}"/>', '<c:out value="${from}"/>', '<c:out value="${to}"/>');
</script>

...只需使用您的实际变量名替换tableId，code，from和to。

您的我的HTML 可能会成为：

<script type="text/javascript">
    <c:forEach var="item" items="${rateperiod_attribute}">
        addRow('systemsettingstid', '<c:out value="${item.code}"/>', '<c:out value="${item.fromDate}"/>', '<c:out value="${item.toDate}"/>');
    </c:forEach>
</script>

如何将参数传递给函数

2 个答案: