使用悬停超时浏览表行时清除隐藏值

Question

大家好，这里只需要一点帮助。我希望你能帮助我。这是一个场景：

1. 在我的分类表中有很多行。每一行都有一个隐藏的文本框，其中包含一个空值和一个唯一的id。当用户导航时，该类别的注释将与该类别的评论表单一起显示在下面。

2. 如果用户在特定类别/行中悬停三（3）秒，则隐藏值将获得类别的id并将其分配给我的隐藏文本框。如果用户没有连续悬停至少3秒，则不会发生任何事情。

3. 之后，如果用户在另一行上悬停3秒，则应清除先前隐藏的文本值，并为悬停的行指定一个新值。

我的问题是，当我在行中导航并停留三秒时，我可以获得正确的隐藏值。但当我转到另一行时，我也可以获得正确的隐藏值，但之前的隐藏值没有清除或重置。我该怎么做？

这是我的代码，我希望你们理解我的要点。谢谢

<?php
foreach($queryViewEntries as $row){
    $temp_id = $row['salescatid'];
    $cat_id = $row['salescatid'];
    echo '<tr>'
        .'<td width="5%" style="text-align: center">'
            .'<input type="text" name="indicator" value="" class="indicator" id="indicator'.$temp_id.'" style="width: 16px" />'
            .'&nbsp;'
            .'<input type="checkbox" name="category[]" value="'.$row['salescatid'].'" id="check'.$row['salescatid'].'" onclick="check(this)" id="comment'.$row['salescatid'].'" />'
         .'</td>'
        .'<td width="10%">{'.$row['salescatname'].'}</td>'
        .'<td class="hover_comment">'
            .'<span style="display: none;">{'.$row['salescatid'].'}</span>'
            .'{'.$row['salescatdesc'].'}'
        .'</td>'
        .'<td width="30%" style="text-align: center;" class="hover_comment">'
            .'<a href="#" class="buttons edit" data-value="'.$cat_id.'" name="edit_item">EDIT</a>'
            .'<a href="#" class="buttons delete" data-value="'.$cat_id.'" name="delete_item">DELETE</a>'
        .'</td>'
    .'</tr>';
}
//HERE I SET THE HIDDEN TO A SIMPLE TEXTBOX(named 'indicator') SO THAT I CAN SEE THE VALUE INSIDE  
?>
//BELOW IS MY JQUERY CODE
$(function(){
    var counter = 0,
        myInterval = null,
        temp = null,
        salesid = null;
    $(".hover_comment").hover(function(e){
        counter = 0;
        myInterval = setInterval(function(){
            ++counter;
            console.log(counter);
        }, 1000);
        salesid = $(this).find('span').text();
        $(".comment_boxes").hide();
        setTimeout(function(){$(".comment_box_"+salesid).fadeIn()}); 
        $('#txt_id').val(salesid);
        $(this).find(".tempid").val();
        $("#comment_add").show(); 
    },function(e){
        clearInterval(myInterval);
        if(counter > 3){
            $("#indicator").val('');
            alert(counter);
            //alert(salesid);
            $("#indicator"+salesid).val(salesid);
        }
    });
}); 

Answer 1

使用JQuery通配符^选择器清除所有#indicator元素：

$("[id^=indicator]").val('');

插入符号^表示选择ID以"indicator"开头的所有行。