Php Ajax在循环中更改onclick事件图像

我试图更改循环内的图像，例如，如果我单击同样位于循环内的按钮，它将完全更改图像，但循环中的其他数据也将更改为零（0）。我还向可单击按钮添加id，以仅更改我单击的图像

这就是iv'e所尝试的：

HTML

<div class="ult_tabitemname current">
    <div id="dashboard">
        <ul class="slider-20" style="width: 5215%; position: relative; transition-duration: 0.2s; transform: translate3d(0px, 0px, 0px);">

        <li aria-hidden="false" style="float: left; list-style: none; position: relative; width: 779px;"><a href="#" class="save travel-saved-img-btn" id="img-1058" current-data="saved"><img src="http://myurl.com/temp/wp-content/uploads/SAVED.png"></a><img src="http://myurl.com/temp/wp-content/uploads/1234-1.jpg" class="image-gallery"><input class="mytravel-img-id" img-cat="20" type="hidden" value="1058"></li>

        <li aria-hidden="true" style="float: left; list-style: none; position: relative; width: 779px;"><a href="#" class="save travel-saved-img-btn" id="img-1059" current-data="save"><img src="http://myurl.com/temp/wp-content/uploads/SAVE.png"></a><img src="http://myurl.com/temp/wp-content/uploads/Travel-Personality-FAQ-image-5_09-1.jpg" class="image-gallery"><input class="mytravel-img-id" img-cat="20" type="hidden" value="1059"></li>

         <li aria-hidden="true" style="float: left; list-style: none; position: relative; width: 779px;">\<a href="#" class="save travel-saved-img-btn" id="img-1060" current-data="saved"><img src="http://myurl.com/temp/wp-content/uploads/SAVED.png"></a><img src="http://myurl.com/temp/wp-content/uploads/Travel-Personality-FAQ-image-3_03-1.jpg" class="image-gallery"><input class="mytravel-img-id" img-cat="20" type="hidden" value="1060"></li>

        </ul>
    </div>
</div>

为了更清楚，这是示例输出。。第一张图片，如果我点击了紫罗兰色按钮，它可以完美地工作并改变图片。。在第二张照片中，另一张图像也变为零。。他们在兜圈子。。

---

您确定整个html中只有一个

li[aria hidden=false]

正确的方法应该类似于通过指定元素的立即数来查找唯一元素以检索所需的属性，例如

$('#dashboard').on("click", 'li > a.save', function(){

    // $( this ).parent() is the immediate parent of 'a.save' which is 'li'
    var img_id      = $( this ).parent().find('.mytravel-img-id').val();
    var img_cat     = $( this ).parent().find('.mytravel-img-id').attr('img-cat');
    var curr_data   = $( this ).attr('current-data');
...

另见：

返回：字符串、数字或数组

描述：获取匹配元素集中第一个元素的当前值

返回：字符串

---

描述：获取匹配元素集中第一个元素的属性值

该类的位置

。ult\u tabitemname.current li[aria hidden=false].mytravel img id？

我认为您应该使用

此

使用您少量提供的html不太可能得到答案。你能说得更具体些吗？哦，对不起。Im使用bxslider-li类是由jqueryI自动生成的，并添加了一些html。请检查..谢谢你的帮助和一个很好的解释！

add_action( 'wp_ajax_nopriv_update_save_ajax', 'update_save_ajax', 20 );
add_action( 'wp_ajax_update_save_ajax', 'update_save_ajax', 20 );
function update_save_ajax(){

$img_id     = $_REQUEST['img_id'];
$img_cat    = $_REQUEST['img_cat'];
$curr_data  = $_REQUEST['curr_data'];
$get_curr_uid = get_current_user_id();

$url = get_bloginfo( 'url' );
$uploads = $url . '/wp-content/uploads';
$save = $uploads. '/SAVE.png';
$saved = $uploads. '/SAVED.png';

if($curr_data == 'save'){
    $get_save_url = $saved;
    $curr_data_save = 'saved';
}else{
    $get_save_url = $save;
    $curr_data_save = 'save';
}


$param = array(
    'get_img_url' => $get_save_url,
    'change_curr_data'  => $curr_data_save,
    'get_curr_img_cat'  => $img_cat
);

echo json_encode($param);

die();
}

$('#dashboard').on("click", 'li > a.save', function(){

    // $( this ).parent() is the immediate parent of 'a.save' which is 'li'
    var img_id      = $( this ).parent().find('.mytravel-img-id').val();
    var img_cat     = $( this ).parent().find('.mytravel-img-id').attr('img-cat');
    var curr_data   = $( this ).attr('current-data');
...