1. 程式人生 > >前端mockjs模擬圖片驗證碼

前端mockjs模擬圖片驗證碼

attr rand dom 點擊 .cn 創建 log json .get

技術分享ps:mockjs在進行相同的雙數次請求的時候,會出現請求404的狀況,希望有大佬幫解決下

首先創建dom

<img id=‘bbn‘ src="" alt="圖圖">
<button id="but">asdsa</button>

在js中先寫好mock

Mock.mock(/query/g,function(option){//攔截query請求
return Mock.mock({
imgUrl: Mock.Random.dataImage(‘50x20‘, Mock.mock({‘regexp‘: /\w{4}/}).regexp)
});
});

在寫點擊事件

$(‘#but‘).on(‘click‘,function(){
$.get(‘query‘,function(data){
var data = JSON.parse(data);
$(‘#bbn‘).attr(‘src‘,data.imgUrl);
});
});

讓初始化就有一個

$.get(‘query‘,function(data){
  var data = JSON.parse(data);
  $(‘#bbn‘).attr(‘src‘,data.imgUrl);
});

前端mockjs模擬圖片驗證碼