如何在 javascript 中获取我的 id 变量的动态值?
How can I get the dynamic value to my id variable in javascript?
我一直在尝试在 javascript 中的 id 变量中获取不同的值,以便我可以根据悬停的 id 获取数据。
我在 <script></script>
中有以下代码
$(document).ready(function() {
$('.stambha-img').hide();
$(".stambha-cat").hover(function() {
var id = document.getElementsByClassName("stambha-cat")[0].getAttribute("value");
$.ajax({
url: '/ajaxCat.php',
type: 'POST',
data: {
id: id
},
success: function(response){
if (typeof(response) != 'object') {
response = $.parseJSON(response);
}
if (response.status.status == true) {
var html_option = ""
$.each(response.body, function(key, value) {
var newsImage = "";
if(value.image === ""){
newsImage = "<?php echo FRONT_IMAGES_URL.'shikshak.jpg' ?>";
} else {
newsImage = value.image;
}
html_option += "<div class='col-md-3'><div class='stambha-img'><img class='img-responsive' src='" + newsImage + "'></div></div>";
});
html_option += "<div>";
$('#catAjax').html(html_option);
} else if(response.status.status == false){
var amount_np = 'hello';
$('#catAjax').html('<div class="container text-center" id="c404"><div class="row"><div class="col-md-6 col-sm-12 offset-md-3 c404"><h5 style="color:#DB4729"><strong>माफ गर्नुहोस्! यस कोटीमा कुनै समाचार छैन।</strong></h5></div></div></div>');
}
}
});
$('.stambha-img').show();
}),
$(".stambha-cat").mouseenter(function() {
$(".stambha-img").show();
});
$(".stambha-cat").mouseleave(function() {
$(".stambha-img").hide();
id = "";
});
});
我想在 mouseleave 事件发生时清除 id 的值,以便当我悬停到下一个项目时,我可以获得其他类别的 id。
而且,我在列表中有以下代码:
<li class="stambha-cat" value="<?php echo $necessary->id ?>"><a class="boldtitle" href="http://<?php echo $necessary->url ?>" target="_blank"><strong><?php echo $necessary->title ?></strong></a></li>
更新:当我将鼠标悬停在另一个类别上时,我得到相同的类别 ID。那是因为 var id = document.getElementsByClassName("stambha-cat")[0].getAttribute("value");
给出了 class "stambha-cat" 中第一个类别的值吗?
用 var id = $(this).attr('value');
替换 var id = document.getElementsByClassName("stambha-cat")[0].getAttribute("value");
对我有用。请参阅下面的完整代码:
$(document).ready(function() {
$('.stambha-img').hide();
$(".stambha-cat").hover(function() {
var id = document.getElementsByClassName("stambha-cat")[0].getAttribute("value");
$.ajax({
url: '/ajaxCat.php',
type: 'POST',
data: {
id: id
},
success: function(response){
if (typeof(response) != 'object') {
response = $.parseJSON(response);
}
if (response.status.status == true) {
var html_option = ""
$.each(response.body, function(key, value) {
var newsImage = "";
if(value.image === ""){
newsImage = "<?php echo FRONT_IMAGES_URL.'shikshak.jpg' ?>";
} else {
newsImage = value.image;
}
html_option += "<div class='col-md-3'><div class='stambha-img'><img class='img-responsive' src='" + newsImage + "'></div></div>";
});
html_option += "<div>";
$('#catAjax').html(html_option);
} else if(response.status.status == false){
var amount_np = 'hello';
$('#catAjax').html('<div class="container text-center" id="c404"><div class="row"><div class="col-md-6 col-sm-12 offset-md-3 c404"><h5 style="color:#DB4729"><strong>माफ गर्नुहोस्! यस कोटीमा कुनै समाचार छैन।</strong></h5></div></div></div>');
}
}
});
$('.stambha-img').show();
}),
$(".stambha-cat").mouseenter(function() {
$(".stambha-img").show();
});
$(".stambha-cat").mouseleave(function() {
$(".stambha-img").hide();
id = "";
});
});
我一直在尝试在 javascript 中的 id 变量中获取不同的值,以便我可以根据悬停的 id 获取数据。
我在 <script></script>
$(document).ready(function() {
$('.stambha-img').hide();
$(".stambha-cat").hover(function() {
var id = document.getElementsByClassName("stambha-cat")[0].getAttribute("value");
$.ajax({
url: '/ajaxCat.php',
type: 'POST',
data: {
id: id
},
success: function(response){
if (typeof(response) != 'object') {
response = $.parseJSON(response);
}
if (response.status.status == true) {
var html_option = ""
$.each(response.body, function(key, value) {
var newsImage = "";
if(value.image === ""){
newsImage = "<?php echo FRONT_IMAGES_URL.'shikshak.jpg' ?>";
} else {
newsImage = value.image;
}
html_option += "<div class='col-md-3'><div class='stambha-img'><img class='img-responsive' src='" + newsImage + "'></div></div>";
});
html_option += "<div>";
$('#catAjax').html(html_option);
} else if(response.status.status == false){
var amount_np = 'hello';
$('#catAjax').html('<div class="container text-center" id="c404"><div class="row"><div class="col-md-6 col-sm-12 offset-md-3 c404"><h5 style="color:#DB4729"><strong>माफ गर्नुहोस्! यस कोटीमा कुनै समाचार छैन।</strong></h5></div></div></div>');
}
}
});
$('.stambha-img').show();
}),
$(".stambha-cat").mouseenter(function() {
$(".stambha-img").show();
});
$(".stambha-cat").mouseleave(function() {
$(".stambha-img").hide();
id = "";
});
});
我想在 mouseleave 事件发生时清除 id 的值,以便当我悬停到下一个项目时,我可以获得其他类别的 id。
而且,我在列表中有以下代码:
<li class="stambha-cat" value="<?php echo $necessary->id ?>"><a class="boldtitle" href="http://<?php echo $necessary->url ?>" target="_blank"><strong><?php echo $necessary->title ?></strong></a></li>
更新:当我将鼠标悬停在另一个类别上时,我得到相同的类别 ID。那是因为 var id = document.getElementsByClassName("stambha-cat")[0].getAttribute("value");
给出了 class "stambha-cat" 中第一个类别的值吗?
用 var id = $(this).attr('value');
替换 var id = document.getElementsByClassName("stambha-cat")[0].getAttribute("value");
对我有用。请参阅下面的完整代码:
$(document).ready(function() {
$('.stambha-img').hide();
$(".stambha-cat").hover(function() {
var id = document.getElementsByClassName("stambha-cat")[0].getAttribute("value");
$.ajax({
url: '/ajaxCat.php',
type: 'POST',
data: {
id: id
},
success: function(response){
if (typeof(response) != 'object') {
response = $.parseJSON(response);
}
if (response.status.status == true) {
var html_option = ""
$.each(response.body, function(key, value) {
var newsImage = "";
if(value.image === ""){
newsImage = "<?php echo FRONT_IMAGES_URL.'shikshak.jpg' ?>";
} else {
newsImage = value.image;
}
html_option += "<div class='col-md-3'><div class='stambha-img'><img class='img-responsive' src='" + newsImage + "'></div></div>";
});
html_option += "<div>";
$('#catAjax').html(html_option);
} else if(response.status.status == false){
var amount_np = 'hello';
$('#catAjax').html('<div class="container text-center" id="c404"><div class="row"><div class="col-md-6 col-sm-12 offset-md-3 c404"><h5 style="color:#DB4729"><strong>माफ गर्नुहोस्! यस कोटीमा कुनै समाचार छैन।</strong></h5></div></div></div>');
}
}
});
$('.stambha-img').show();
}),
$(".stambha-cat").mouseenter(function() {
$(".stambha-img").show();
});
$(".stambha-cat").mouseleave(function() {
$(".stambha-img").hide();
id = "";
});
});