0

概念：

我在struts2 java中有一个动态表单，当用户单击“添加新Edu”链接时，将触发一个jquery函数来扩展动态表单。这是我的jsp：

<html>
<head>
<script language="text/javascript" src="js/jquery-1.9.0.js"></script>
<script language="text/javascript" src="js/common.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Education List</title>
</head>
<body>
<s:form action="/save" method="POST">   
    <div class="educationForm">
        <c:if test="${ (not empty educations) }"> 
            <c:if test="${ fn:length(educations) ge 1 }">
                <c:forEach items="${educations}" var="edu" varStatus="status">
                    <div class="educations">                    
                        <label>Position</label><input type="text" name="educations[${ status.index }].index" value="${ educations[status.index].index }" /><br/>
                        <label>School</label><input type="text" name="educations[${ status.index }].school" value="${ educations[status.index ].school }" /><br/>
                        <label>Degree</label><input type="text" name="educations[${ status.index }].degree" value="${ educations[status.index ].degree }" /><br/>
                        <label>GPA</label><input type="text" name="educations[${ status.index }].scored" value="${ educations[status.index ].scored }" /><br/>
                        <label>Start Date</label><input type="text" name="educations[${ status.index }].startDate" value="${ educations[status.index].startDate }" /><br/>
                        <label>End Date</label><input type="text" name="educations[${ status.index }].endDate" value="${ educations[status.index].endDate }" /><br/>
                    </div>
                </c:forEach>        
            </c:if>         
        </c:if>
        <div class="educations">
            <label>Position</label><input type="text" name="educations[${fn:length(educations)}].index" value="${fn:length(educations) + 1}" /><br/>
            <label>School</label><input type="text" name="educations[${fn:length(educations)}].school" /><br/>
            <label>Degree</label><input type="text" name="educations[${fn:length(educations)}].degree" /><br/>
            <label>GPA</label><input type="text" name="educations[${fn:length(educations)}].scored" /><br/>
            <label>Start Date</label><input type="text" name="educations[${fn:length(educations)}].startDate" /><br/>
            <label>End Date</label><input type="text" name="educations[${fn:length(educations)}].endDate" /><br/>
        </div>
    </div>  
    <a href="#" id="addButton">Add new Edu</a>
    <input type="submit" value="Save" />        
</s:form>

<div class="template_educations" style="display:none">
    <div class="educations">
        <label>Position</label><input type="text" name="educations[_X_].index" /><br/>
        <label>School</label><input type="text" name="educations[_X_].school" /><br/>
        <label>Degree</label><input type="text" name="educations[_X_].degree" /><br/>
        <label>GPA</label><input type="text" name="educations[_X_].scored" /><br/>
        <label>Start Date</label><input type="text" name="educations[_X_].startDate" /><br/>
        <label>End Date</label><input type="text" name="educations[_X_].endDate" /><br/>
    </div>
</div>
</body>
</html>

Common.js 文件：

$(document).ready(function(){
    $("#addButton").click(function(event){
        event.preventDefault();
        $(".educationForm").append($(".template_educations").html);
        $(".educationForm").children(".educations").last().children("input").each(function(){           
            var count = $(".educationForm").children(".education").length();
            var value = $(this).attr("name");
            value.replace("_X_", count + 1);
            $(this).attr("name", value);
        });         
    });
});

问题：

  • jquery 函数似乎无法正常工作。我在Use jquery click to handle anchor onClick()中尝试了一些建议，但没有帮助。

  • 通常，我使用 chrome 来调试 javascript。但是在这种情况下，js文件没有出现在chrome开发工具的sources选项卡中，所以我无法在chrome中调试它。

对我的问题有什么建议吗？

4

1 回答 1

1

您的脚本标记定义无效，语言属性应该具有值javascript而不是 if text/javascript>。

<script language="javascript" src="js/jquery-1.9.0.js"></script>
<script language="javascript" src="js/common.js"></script>
于 2013-04-03T05:16:26.047 回答