javascript - 带有回调函数的 jQuery get() 方法

Question

作为 jQuery 的学徒，我正在研究 jQuery。

在我的 jindex2.html 文件中，我使用下面的 jQuery 代码块从名为 test.asp 的外部文件获取数据

$(document).ready(function(){
  $("btn1").click(function(){
    $.get("test.asp", function(content, status){
      alert("This is the content of the file :- " + content + "\nStatus is :- " + status);
    });
  });
});

test.asp文件内容如下。

<%
response.write("Mohan Perera from Panadura")
%>

下面我展示了jindex2.html文件的全部代码。

$(document).ready(function(){
  $("#flip").click(function(){
    $("#panel").slideToggle("slow");
  });
});

$(document).ready(function(){
  $("p").click(function(){
    $("#img1").hide();
  });
});
  
$(document).ready(function(){
  $("btn1").click(function(){
    $.get("test.asp", function(content, status){
      alert("This is the content of the file :- " + content + "\nStatus is :- " + status);
    });
  });
});

#panel, #flip {
  padding: 5px;
  text-align: center;
  background-color: #5d90fd;
}

#panel {
  padding: 50px;
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h2>Image Disappear</h2>
<p>This jquery application will help us to make invisible the below image</p>
<img src="imgeJquery.png" id="img1" /><br/>

<div id="flip">Click on this !</div>
<div id="panel">Because time is valuable, we deliver quick and easy learning.<br>
    At W3Schools, you can study everything you need to learn, in an accessible and handy format.</div><br/>

<form>
  <input type="button" id="btn1" value="Click !"/>
</form>

我用过的另外两个 jQuery 工作正常。但是上面提到的一个不起作用。单击 btn1(单击!)后，我想在警告框中显示 test.asp 文件的内容。请通过在此处显示我的错误来帮助我做到这一点。

Answer 1

在下面的 jQuery 使用中，在向按钮 (id:btn1) 添加事件时错过了 #。

如果你写的是基于 id #(tag id) -> #btn1，如果它是 class .(tag class) ->.btn1

试试下面的代码

$(document).ready(function(){
  $("#btn1").click(function(){
    $.get("test.asp", function(content, status){
      alert("This is the content of the file :- " + content + "\nStatus is :- " + status);
    });
  });
});