jquery run serverside script when mouseover

Question

У меня есть сайт, где мне нужно проверить все href-ссылки, если они находятся в пользовательском словаре на сайте. Если они существуют, атрибут title в теге a должен быть установлен на текст, который извлекается с сервера. Я положил это вместе на основе других wuestions с этого сайта (например, не тестировался):

// How to only activate "a href" links? 
jQuery('a').mouseover(function() { 

    // should be what is between <a href="">this text</a>. Is this correct? 
    var dictionaryWord = jQuery(this).text(); 

    // do a server site call to get description for the word given in the var above 
    jQuery.get("/getDescriptionFromDictionaryWord.aspx", { word: dictionaryWord }, 

    function(data){ 
     // set title tag for the a-tag actual a-tag 
     // will "this" refer to the a-tag with mouseover? 
     jQuery(this).attr("title", data); 

    }); 

}); 

Там могут быть ошибки в указанных выше. Я только что создал его из разных ответов, найденных здесь, в StackOverflow. Есть ли лучший способ получить ответ от сервера, чем выше?

Если это работает, мне нужен только хороший способ показать тег заголовка при наведении указателя мыши. Я видел некоторые пакеты для этого, чтобы это было достаточно легко.

BR. Андерс

UPDATE (на основе ответов ниже)

// all "a href" do this for the first mouseover "one.()" 
jQuery('a[href]').one('mouseover',(function() { 


    // get a reference to the clicked + get dictionary word 
    var anchor = jQuery(this), 
     dictionaryWord = anchor.text(); 

    // do a server site call to get description for the word given in the var above 
    jQuery.get("/getDescriptionFromDictionaryWord.aspx", { word: dictionaryWord }, 

    function(data){ 
     // set title tag for the a-tag actual a-tag 
     // will "this" refer to the a-tag with mouseover? 
     anchor.attr("title", data); 

    }); 

})); 

Answer 1

Некоторые imporvements:

//Match only a with the href attribute 
jQuery('a[href]').mouseover(function() { 

    var dictionaryWord = jQuery(this).text(), 
    //cache the context and use it in the ajax function 
    el=jQuery(this); 

    jQuery.get("/getDescriptionFromDictionaryWord.aspx", { word: dictionaryWord }, 

    function(data){ 
     //You can't use the $(this) use the cached context 
     el.attr("title", data); 
    }); 

}); 

Это должно работать.

Answer 2

Этот код должен работать, однако, на мой взгляд, лучше загружать заголовки без javascript, так как это уменьшает нагрузку на сервер. Если вы не хотите показывать какое-то описание с помощью HTML. Для этих целей атрибут attr не является вариантом.

Answer 3

Что вы написали произведения, при условии, что getDescriptionFromDictionaryWord.aspx выглядит примерно так:

Response.Clear(); 
Response.Write("description for word"); 
Response.End(); 

т.е. весь ответ на значение, которое вы хотите отобразить.

Лучшим способом сделать это было бы создание нового файла типа «Веб-сервис (asmx)», назовите его «Dictionary.asmx». В/VB файл CS, который создается, убедитесь, раскомментировать закомментированный ScriptService атрибут, а затем добавить метод, который выглядит следующим образом:

[WebMethod] 
public string GetDescription(string word) { 
    // internal logic for dictionary lookup 
    return description; 
} 

Таким образом, вы можете отправить запрос, как это:

$('a[href]').mouseover(function() { 

    // the above selector finds all anchors with 'href' attribute 

    var anchor = $(this); // get a reference to the clicked item 
    var dictionaryWord = anchor.text(); 

    jQuery.get("/Dictionary.asmx/GetDescription", { word: dictionaryWord }, function(data){ 
     anchor.attr("title", data.d); // .NET will wrap the response in a 'd' property 
    }); 

}); 

Answer 4

Я бы предположил также использовать $('a[href]').one('mouseover',function()... вместо $('a[href]').mouseover(function()... так, чтобы он делал это только один раз на ссылку, а не сверхурочно, когда вы наводили указатель на ссылку.