我正在使用此代码加载页面内容而不刷新
<script>
$(document).ready(function(){
//set trigger and container
var trigger = $('#nav ul li a'),
container = $('#container');
//do on click
trigger.on('click', function(e){
/***********/
e.preventDefault();
//get the link location that was clicked
pageurl = $(this).attr('href');
//to change the browser URL to th if(pageurl!=window.location){
window.history.pushState({path:pageurl},'',pageurl+'.php');
/* reload content without refresh */
//set loading img
$('#container').append('<div id = "loading">WAIT... <img src = "img/ajax-loader-small.gif" alt="Currently loading" /></div>');
//change img location to center
$("#loading").css({"position": "absolute", "left": "50%", "top": "50%"});
//get the trigger to reload the contents
var $this = $(this),
target = $this.data('target');
container.load(target + '.php');
});
});
// fix url in the browser when click on backward and foreword arrows
$(window).bind('popstate', function() {
$.ajax({url:location.pathname+'?rel=tab',success: function(data){
$('#container').html(data);
}});
});
</script>
然后我尝试获取 id 值并使用 ajax 将其发送到另一个页面,因为没有刷新。
<li><a href="#"><strong>CATEGORY</strong><span> MENU ELEMENTS</span></a>
<ul class="sub-menu">
<li><a id="id_1" data-target='post_category'>Sub_1</a></li>
<li><a id="id_2" data-target='post_category'>Sub_2</a></li>
<li><a id="id_3" data-target='post_category'>Sub_3</a></li>
<li><a id="id_4" data-target='post_category'>Sub_4</a></li>
<li><a id="id_5" data-target='post_category'>Sub_5</a></li>
<li><a id="id_6" data-target='post_category'>Sub_6</a></li>
<li><a id="id_7" data-target='post_category'>Sub_7</a></li>
</ul>
</li>
JQuery 代码
<script>
$(document).on("click","a",function(e){
$.ajax({
url: "post_category.php",
type: "POST",
data: $(this).attr("id")
});
});
</script>
其他页面的php代码
<?php
if(isset($_POST['id'])){
echo 'Worked';
} else {
echo 'No data';
}
jquery 成功获取了 id,但它没有将数据正确发送到所需的页面,因此它总是未设置,并且我在 else 条件下得到 No data。我尝试了一切,但没有任何效果。请帮忙。
最佳答案
需要以键值对的方式发送数据,以便在其他页面可以通过key访问。 此外,this 指的是文档,因此 $(this).attr('id') 为空。 您可以尝试如下所示的代码:
<script>
$(document).on("click","a",function(e){
var element =e.target;
$.ajax({
url: "post_category.php",
type: "POST",
data: {'id':$(element).attr("id")}
});
</script>
关于javascript - JQuery 从加载的 ajax 发送元素 id 数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37353882/