Question

在此代码中，我尝试将标题追加到具有唯一ID的span中。这个AJAX调用将返回用户名并将其附加到具有特定ID的特定范围只有一次，所以如果我再次悬停它应该不起作用。

现在它正在使用AJAX调用，但每次我悬停时它仍会运行。它在跨度不跨越后附加的另一个问题。怎么解决？

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {

        $("#16").hover(function(e){
            var val = 16;
            $.ajax({
                'type': 'get',
                'url': 'tree/get_parent_ajax/'+ val,
                'dataType': 'json',
                'success': function (data) {
                    $("span#"+val).append("title= '" + data + "'");
                    alert(data);
                }
            }, function(){
                e.stopPropagation();
                //This function is for unhover.
            });

        });
    });

</script>


<a href="http://localhost/ammar/users/cv/16" class="color-white" target="_blank">
                <span id="16" class="first_name">الجد راشدtitle= ' الجد راشد  عبدالرحمن بن عمار آل محمد 'title= ' الجد راشد  عبدالرحمن بن عمار آل محمد 'title= ' الجد راشد  عبدالرحمن بن عمار آل محمد 'title= ' الجد راشد  عبدالرحمن بن عمار آل محمد 'title= ' الجد راشد  عبدالرحمن بن عمار آل محمد 'title= ' الجد راشد  عبدالرحمن بن عمار آل محمد '</span>
                </a>

Answer 1

我没有得到您想要的确切内容，但您可以检查范围是否已包含data.Ex：

$("#16").hover(function(e){

        $(this).unbind('mouseenter mouseleave'); //detach event listeners
       if($(this).html()!="")
       {
       var val = 16;
        $.ajax({
            'type': 'get',
            'url': 'tree/get_parent_ajax/'+ val,
            'dataType': 'json',
            'success': function (data) {
                $("#"+val).html('');   
                $("span#"+val).append("title= '" + data + "'");
                alert(data);
            }
         );
        }, function(){
            e.stopPropagation();
            //This function is for unhover.


    });

并且在ajax成功时，只需清空span的旧值并添加新接收的值。

Answer 2

只需使用计数器即可获得第一个悬停或其他：

$(document).ready(function() {
    var counter = 0;
    $("#16").hover(function(e){
        var val = 16;
        if(counter==0){
        $.ajax({
            'type': 'get',
            'url': 'tree/get_parent_ajax/'+ val,
            'dataType': 'json',
            'success': function (data) {
                $("span#"+val).attr("title= '" + data + "'");
                counter = counter + 1;
                alert(data);
            }
        }, function(){
            e.stopPropagation();
            //This function is for unhover.
        });
        }
    });
});

页面加载时计数器将为0（并将执行ajax调用）。当ajax成功时，它将变为1，然后悬停将不再触发ajax，除非您重新加载页面。我还明确了关于标题的观点。您需要使用.attr（）来更改html元素的属性。 .append将用于在html标记内添加文本。因此，如果您想在页面中可见的范围内添加一些文本

，将会使用它

如何按时追加并追加到跨度中

2 个答案: