<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>vue和jQuery嵌套實現異步ajax通信</title>
<script src="../js/jquery.min.js"></script>
<script src="../js/vue.js"></script>
<script>
// 可以兼容jQuery和vue的單一入口
window.onload = function(){
var app = new Vue({
el:"#app",
// vue內置屬性用來綁定事件
methods:{
get:function(){
// 發送get請求
$.ajax({
// 指定請求方式
type:"GET",
// 網址,ajax.php特制的服務器端請求
url:"http://192.168.1.238/ajax.php",
// 數據格式,jsonp是一種跨域請求的格式
dataType:"jsonp",
// 回調函數
jsonp:"callback",
// 通信成功后，打印服務器端返回的數據
success:function(msg){
// alert(msg.text);
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>vue和jQuery嵌套實現異步ajax通信</title>
<script src="../js/jquery.min.js"></script>
<script src="../js/vue.js"></script>
<script>
// 可以兼容jQuery和vue的單一入口
window.onload = function(){
var app = new Vue({
el:"#app",
// vue內置屬性用來綁定事件
methods:{
get:function(){
// 發送get請求
$.ajax({
// 指定請求方式
type:"GET",
// 網址,ajax.php特制的服務器端請求
url:"http://192.168.1.238/ajax.php",
// 數據格式,jsonp是一種跨域請求的格式
dataType:"jsonp",
// 回調函數
jsonp:"callback",
// 通信成功后，打印服務器端返回的數據
success:function(msg){
// alert(msg.text);
// 使用jQuery實時渲染頁面(改變div盒子)的內容
$("#message").html("下午好，您已成功登錄！")
}
});
}
$("#message").html("下午好，您已成功登錄！")
}
});
}