JQ自動調用、Ajax跨域調用

問題描述

      在央視官網划水的時候,發現一個點贊排名,試着點擊了幾次,竟然發現沒有防重複提交,如下圖:

在這裏插入圖片描述
於是想着用代碼實現自動間隔點贊

初步代碼實現

      初始代碼如下:

$(function() {
				var num = 0;
				setInterval(function() {
					$.ajax({
						type: "get", //請求方式
						url: "http://*********TACT1499325086744310&num=1&jsonp_callback=TACT1499325086744310",
						success: function(data) {
							//請求成功處理,和本地回調完全一樣
							console.log("點贊成功" + num + "次");
							num++;
						},
						error: function() {
							//請求出錯處理
							console.log(data);
						}
					});
				}, 1000);
			});

代碼解釋

$(function() {
		setInterval(function() {
                  //dosomething
                 },num)
		}
)

setInterval() :是一個定時器,裏面的 function是一個匿名函數 ,我們可以把想執行的一些代碼寫在裏面;
num :這是一個參數,表示多少毫秒執行一直,我這裏寫1000就表示每秒鐘執行一次.

ajax跨域問題

但是這樣請求的話,會出現如下的 ajax跨域調用問題:
在這裏插入圖片描述

查詢了一些資料以後,得出以下最終的解決辦法如下:

$(function() {
		var num = 0;
		setInterval(function() {
			$.ajax({
				type: "get", //請求方式
				async: true, //是否異步
				url: "http://***************TACT1499325086744310&num=1&jsonp_callback=TACT1499325086744310",
				dataType: "jsonp", //跨域json請求一定是jsonp
				jsonp: "jsonp_callback", //跨域請求的參數名,默認是callback
				//jsonpCallback:"successCallback",    //自定義跨域參數值,回調函數名也是一樣,默認爲jQuery自動生成的字符串
				data: {
					"query": "civilnews"
				}, //請求參數
				beforeSend: function() {
					//請求前的處理
				},
				success: function(data) {
					//請求成功處理,和本地回調完全一樣
					console.log("點贊成功" + num + "次");
					num++;
				},
				complete: function() {
					//請求完成的處理
				},
				error: function() {
					//請求出錯處理
					console.log(data);
				}
			});
		}, 1000);
	});

最終效果

在這裏插入圖片描述

發佈了101 篇原創文章 · 獲贊 37 · 訪問量 11萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章