Question

我有一个使用JSP页面的Java EE Web应用程序。我在JSP中包含了一些JavaScript，但是当我在服务器上运行它时它不起作用。它适用于Chrome。

有什么想法吗？

这是我的JSP页面：

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
  <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"        "http://www.w3.org/TR/html4/loose.dtd">
   <html>
<head>
  <%@ page isELIgnored="false" %>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script  src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script type="text/javascript" >
$(function(){ //Add, Save, Edit and Delete functions code 
    //$(".btnEdit").bind("click", Edit); 
    //$(".btnDelete").bind("click", Delete); 
    $("#btnAddd").bind("click", Add); 
    $('#btnSave1').click(function(event) {       
        var engagement_code = "a" ;//$('#code').val();
        var engagement_name = "b";//$('#name').val();
        //var harga = $('#harga').val();
        var json = { "engagement_code" : engagement_code, "engagement_name" : engagement_name};
        $.ajax({
            url: 'engagementregister',
            type: 'POST',
            data: JSON.stringify({
                'engagement_code': engagement_code,
                'engagement_name': engagement_name,

            }),
            processData: false,
            ContentType: 'application/json',
            dataType: 'json',
            success: function () {
                console.log("success");}

    });
    });
});
    //$("#btnSave1").bind("click", Save1);

function Add()
{ $("#list tbody").append(
        "<tr>"+ 
        "<td><img src='image/edit.png'/></td>"+
        "<td><input id='code' type='text'/></td>"+ 
        "<td><input id='name' type='text'/></td>"+ 
        "<td><input type='text'/></td>"+ 
        "<td><select id='sl'> <option value='ADM' label='ADM'/><option value='CSD' label='CSD'/><option value='PBS' label='PBS'/></select></td>"+
        "<td><input type='text'/></td>"+
        "<td><input type='text'/></td>"+
        //"<td><img src='image/edit.png' class='btnSave'></td>"+  
        "<td><input type='button' value='Save' onclick='Save()' class='btnSave'/></td>" +"</tr>");
        $(".btnSave").bind("click", Save);  
        //$(".btnEdit").bind("click", Edit); 
        }; 

function Save()
{ 
var par = $(this).parent().parent(); //tr 
var tdCode = par.children("td:nth-child(2)"); 
var tdName = par.children("td:nth-child(3)"); 
var tdClient = par.children("td:nth-child(4)"); 
var tdSL = par.children("td:nth-child(5)");
var tdBU = par.children("td:nth-child(6)");
var tdEM = par.children("td:nth-child(7)");
var tdButton1 = par.children("td:nth-child(1)"); 
var tdButton2 = par.children("td:nth-child(8)"); 
//var e = document.getElementById("sl");
//var tdSL = e.options[e.selectedIndex].value;
tdCode.html(tdCode.children("input[type=text]").val()); 
tdName.html(tdName.children("input[type=text]").val()); 
tdClient.html(tdClient.children("input[type=text]").val()); 
tdSL.html(tdSL.children('select').val());
tdBU.html(tdBU.children("input[type=text]").val()); 
tdEM.html(tdEM.children("input[type=text]").val());
tdButton1.html("<img src='image/edit.png' class='btnEdit'/>");

//$(".btnEdit").bind("click", Edit); 
};
</script>
<title>Engagement list</title>
</head>
<body>
<h1>Engagement list</h1>

<c:url var="editImgUrl" value="edit.png" />
<c:url var="deleteImgUrl" value="delete.png" />
<c:if test="${!empty list}">
<form>
<div style="overflow:scroll;overflow:auto">

    <table id="list" style="border: 1px solid; width: 100%; text-align:center">
        <thead style="background:#d3dce3">
            <tr>
                <th colspan="1"></th>

                <th>Engagement code</th>
                <th>Engagement Name</th>
                <th>Client</th>
                <th>SL</th>
                <th>BU</th>
                <th>EM</th>
                <th colspan="1"></th>
            </tr>
        </thead>
    <tbody style="background:#ccc">
        <c:forEach items="${list}" var="eng">

            <c:url var="detailsUrl" value="/details?id=${eng.engagement_code}" />

            <tr>
            <td><a href="details?id=${eng.engagement_code}"><img src="${deleteImgUrl}"></img></a></td> 
                <td>${eng.engagement_code}</td>
                <td><c:out value="${eng.engagement_name}" /></td>
                <td><c:out value="${eng.client}" /></td>
                <td><c:out value="${eng.SL}" /></td>
                <td><c:out value="${eng.BU}" /></td>
                <td><c:out value="${eng.EM}" /></td>

   <td><a href="eneditform?id=${eng.engagement_code}"><img src="${editImgUrl}"></img></a></td>  


   </tr>

 </c:forEach>
 </tbody>
</table>
</div>
</form>
</c:if>
<c:if test="${empty list}">  
No records found.

</c:if>
<br/><br/><br/><br/><br/><br/><br/><br/>
<button id="btnAddd">New</button>
<button id="btnSave1">Save</button>
<%-- <input type="button" value="Save" onclick="Save1()"/>--%>
 <a href="accueil">return</a>  
</body>
</html>

Answer 1

eclipse内部浏览器不是一个完整的浏览器，它不支持所有现代浏览器功能（JS，CSS ...）

您可以在eclipse中启动tomcat并使用其他浏览器。

JavaScript脚本在Tomcat中不起作用，但在Chrome浏览器中起作用

1 个答案: