我在侧边栏中创建了ajax调用,当我在导航中单击color时,它可以完美地工作,这里的一切都很好。
代码为:
<a id='color'>Color</a>
javascript函数:
document.getElementById('color').addEventListener('click', color);
function color(){
var xhr = new XMLHttpRequest();
xhr.open('GET', 'setting/color.php', true);
xhr.onload = function(){
if(this.status == 200){
history.pushState(null, null, '?c=color');
document.getElementById('content').innerHTML = this.responseText;
} else if(this.status = 404){
document.getElementById('content').innerHTML = 'Not Found';
}
}
xhr.onerror = function(){
console.log('Request Error...');
}
xhr.send();
}
之后,我想在color页上看到这段代码,它在color.php上,这是来自ajax调用的。
<div class="f-col s1 m1 l1">
<label class="container f-padding">
<input class="cols" type="radio" name="cols" value="dark light-hover">
<span class="checkmark dark"></span>
</label>
</div>
<div class="f-col s1 m1 l1">
<label class="container f-padding">
<input class="cols" type="radio" name="cols" value="light dark-hover" checked="checked">
<span class="checkmark light"></span>
</label>
</div>
javascript函数如下:
var colito = document.getElementsByClassName('cols');
var i;
for(i=0;i < colito.length;i++){
colito[i].addEventListener('click', colorSid);
function colorSid(e){
e.preventDefault();
var cols = this.value;
var params = "cols="+cols;
var xhr = new XMLHttpRequest();
xhr.open('POST', '../phppath/color.php', true);
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xhr.onload = function(){
console.log(this.responseText);
}
xhr.send(params);
}
}
它不工作,如果我不刷新页面,有什么问题谁知道?
3条答案
按热度按时间bakd9h0s1#
固定的!代码在第一个ajax函数中^_^
k97glaaz2#
我看到了您的javascript代码。您将在事件列表中调用的函数放入,它必须在javascript for循环之外。下面我为您在标题中提到的问题的答案编写代码。
7uhlpewt3#
你必须保持你的html在一个字符串中
color.php
和回声。