使用AJAX加载方法加载jsp页面

时间:2013-02-20 18:33:51

标签: jquery ajax

大家好我需要一些关于ajax加载方法的帮助。基本上我需要使用Ajax load()在用户检查单选按钮后在主页面中显示jsp。我附上了需要显示jsp的页面图像以及我的jsp代码..请帮忙!web page

   <div id="verification">
    <p align=center class="4f1_title" ><u>Verification Decision</u></p>
     <table border="0" cellpadding="0" cellspacing="0" align=center
width="100%">
<tbody>

    <tr>
        <td width="10%"></td>
        <td width="8%">Passed <input id="passed" type="radio"
            value="P" onclick="()"></td>
        <td colspan="2" width="8%">Pending <input id="pending"
            type="radio" value="H" onclick="()"></td>
        <td width="9%">True Hit <input id="failed" type="radio"
            value="F" onclick="()" disabled></td>
        <td width="13%">Parcel Returned <input id="returned"
            type="radio" value="S" onclick="()"></td>
        <td width="23%">Referred to Law Enforcement <input id="law"
            type="radio" value="L" onclick="()"></td>
        <td width="8%">Retired <input id="retired" type="radio"
            value="R" onclick="()" disabled></td>
              <td width="12%">Return Reason <input id="ac" 
              type="radio" value="C" onclick="()"></td>
         <td width="10%"></td>
    </tr>
         </tbody>
          </table>
         </div>
            <br>

                     <div align=center>
                <a href="javascript:handleClick()"><u>
              <div id='showhidecomment'>Show Comments</div></u></a>
              <div id='chkcomments'>
               </div>
    </div>
     <br>

2 个答案:

答案 0 :(得分:6)

尝试

$(function() { // when DOM is ready
    $("#showhidecomment").click(function(){ // when #showhidecomment is clicked
        $("#chkcomments").load("sample.jsp"); // load the sample.jsp page in the #chkcomments element
    }); 
});

并将您的html(链接部分)更改为

<div>
    <div id='showhidecomment'>Show Comments</div>
    <div id='chkcomments'></div>
</div>

由于div元素在a元素内无效。


更新 以发表评论

我会为这些元素添加自定义data-url属性(指定要加载的页面

<input id="passed" type="radio" value="P" data-url="some-page.jsp" />
<input id="law" type="radio" value="L" data-url="some-other-page.jsp" />
<input id="ac" type="radio" value="C" data-url="some-third-page.jsp" />

然后对它们应用单个处理程序

$('#verification').on('change','input[type="radio"][data-url]', function(){
    if (this.checked){
        var url = $(this).data('url');
        $("#chkcomments").load( url );
    }
});

答案 1 :(得分:2)

如果您只想加载页面,可以使用jquery加载:http://api.jquery.com/load/

还有jquery get:http://api.jquery.com/jQuery.get/

您可以在文档中找到一个简单的示例。

<强>更新

如果还没有,可能需要添加对jquery库的引用。请参阅下面的示例代码。

简单页面显示'hello world':http://jsbin.com/ivinuw/1/

带按钮的页面。单击按钮时,它使用jquery加载到ajax将上面的页面加载到div容器中: http://jsbin.com/ubitat/1/edit