javascript - 带有 AJAX 的 Jquery，不调用操作也不显示输出。但是，能够在没有 ajax 的情况下使用旧方式

Question

我正在使用 Ajax 异步从数据库中提取一份报告。当我使用此代码时，我能够做到

function showCustomer(str)
{
    alert("Report is loading..!Please wait");

var xmlhttp;    
if (str=="")
  {
  document.getElementById("txtHint").innerHTML="";
  return;
  }
if (window.XMLHttpRequest)
  {  xmlhttp=new XMLHttpRequest();
  }
else
  {
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","Pull.action?rel="+str,true);
xmlhttp.send();
} 

但是当我尝试使用 jquery ajax 时，我无法获得输出，

$(document).ready(function() {
    $("#submit").click(function(event){
        $("#submit").hide();
        $('#txtHint').text("Loading..! Please Wait. !!");
        var name = $("#first").name();

        alert(name);

        $.ajax({
            type: "GET",
            url:"Pull.action?rel="+name,
             context: document.body,
            success: function(data){
                alert(name);
$('#txtHint').html(data);
                //$('#txtHint').load("Pull.action?rel="+name);
                $("#submit").show();
            }           
        });
    });
 });

我在这里做错了吗，它也没有调用“pull.action”Struts2 动作。

正在使用的 JSP 是

<form action=""> 
<table><tr><td>
<s:select id="first" label="Please select the Go Live Date : "  name="applicationPhases" value="%{applicationPhases}" headerValue="--Select--"
  list="{'--Select--','Q1','Q2','Q3','Q4','Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'}" />
</td><td>
<s:submit id="submit" name="submit" value="Submit"  />  
</td></tr> </table>
</form>
<br /><br />
<br />
<div id="txtHint" />

请帮助我使用 jquery 发出 ajax 请求以从 jsp 调用一个动作类并在同一 jsp 中显示输出。（输出将是显示标签表，变量必须通过 url 传递给动作类）

Answer 1

这个 Jquery ajax 帮助我达到了我的要求，

$(document).ready(function() {
    $("#report").click(function(event){
        $("#report").hide();
        $('#txtHint').text("Loading..! Please Wait. !!");
        var name = $("#first").val();
        alert(name);
        $.ajax({
            type: "GET",
            url:"Pull.action",
            data:{"name":name},
            context: document.body,
            success: function(data){
                $('#txtHint').html(data);
                $("#report").show();
            }    
    error:function(){
                          $('#txtHint').html(data);
                          alert("Error in pulling details");
                            }
        });
    });
 });