php后台登录页修改成ajax,使用php后台给自己做一个页面路由,配合ajax实现局部刷新。(示例代码)...
今天就要放假了,把近來囤積的小玩意兒總結(jié)整理一下。
在請求一個html頁面來嵌入到當前頁會有一個問題,就是跟隨請求過來的html他的樣式表和腳本會失效。是因為文檔加載的先后順序等問題造成的。因此,加載一些純文本還好。
舉個例子,只有這個問題明白了,我們的原理才好理解。
b.html有一個點擊事件,但是a.html通過ajax拿到b.html后,如果這個b.html的js不是寫在頁面里面的,你就會發(fā)現(xiàn)沒有生效。css樣式也一樣,都需要重新綁定一下。
首先定義兩個頁面,一個父頁面a.html,一個b.html
a頁面我給它一個請求按鈕
我要一個頁面,php快給我。
給他一個容器
b頁面不要有head和body
我是被拿到一個頁面,我的內(nèi)容是加油!
b頁面的js一定是一個單獨的文件,如果css的話,我就只給了一個js腳本。
$(‘#p‘).css(‘background‘,‘red‘).on(‘click‘,function () {
alert(‘a(chǎn)sdasd‘);
});
先來看我的后臺php控制,其實這里也可以不用php,直接拿地址也行,不過感覺不夠高級,寫在php里,是不會有‘痕跡’的。
$content =file_get_contents(‘pegr/a.html‘);//我將a頁面和a.js都放在分頁文件夾下了
$script=file_get_contents(‘pegr/a.js‘);
echo $content,$script;
然后是我們的js里的ajax請求
$(‘button‘).on(‘click‘,function () {
$.ajax({
url:‘getData.php‘,
type:‘POST‘,
async:true, //是異步加載
success:function(data){
console.log(data); //如果你不清楚下面為什么查找‘$’,看看輸出的data就明白了
for (var i = -1, arr = []; (i = data.indexOf("$", i + 1)) > -1; arr.push(i));
//alert(arr);
var scripts =$(‘‘+data.substring(arr)+‘‘);
$(‘.cont‘).html(data.substring(0,arr));
// alert(data.substring(arr)) 分理出js腳步
$(‘body‘).append(scripts);
},
error:function(xhr){
console.log(‘錯誤‘);
console.log(xhr);
}
})
})
祝大家新年快樂。我今天下午也就可以回家了吧,想想還有些激動呢。
總結(jié)
以上是生活随笔為你收集整理的php后台登录页修改成ajax,使用php后台给自己做一个页面路由,配合ajax实现局部刷新。(示例代码)...的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: js阻止ajax继续请求,js 拦截全局
- 下一篇: 动态规划算法php,php算法学习之动态