jquery .blur не работает с более чем одним текстовым полем.Стреляя как по фукусу, так и снаружи - PullRequest
Новая
       7

jquery .blur не работает с более чем одним текстовым полем.Стреляя как по фукусу, так и снаружи

1 голос
/ 15 марта 2012

Я использую jQuery .blur на элементах управления Textbox в ASP.NET.Мой код jQuery приведен ниже.

Проблема в том, что я могу изменить фокус с TextBox1 на TextBox2 или наоборот.Он запускает обе функции jQuery.Но я хочу, чтобы они срабатывали только тогда, когда фокус управления теряет фокус.Работает нормально на одном TextBox.Но с двумя или более, при изменении фокуса он запускает две функции.

Любые предложения, пожалуйста.Заранее спасибо.

С уважением 

 $("#MainContent_TextBox1").blur(function () {
            $.ajax({
                type: "POST",
                url: document.location.pathname + '/Test',
                data: '{name: "' + $("#MainContent_TextBox1").val() + '" }',
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (msg) {
                    alert(msg.d);
                }
            });
    });

    $("#MainContent_TextBox2").blur(function () {

            $.ajax({
                type: "POST",
                url: document.location.pathname + '/Test',
                data: '{name: "' + $("#MainContent_TextBox2").val() + '" }',
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (msg) {
                    alert(msg.d);
                }
            });
    });

ASP.NET 

<asp:TextBox ID="TextBox1" runat="server" Text="Text box 1"></asp:TextBox><br />
   <asp:TextBox ID="TextBox2" runat="server" Text="Text box 2"></asp:TextBox><br />
    <asp:TextBox ID="TextBox3" runat="server" Text="Text box 3"></asp:TextBox><br />
    <asp:Button ID="Button1" runat="server" Text="Button" /><br />

Источник браузера 

<input name="ctl00$MainContent$TextBox1" type="text" value="Text box 1"     id="MainContent_TextBox1" class="myclass" /><br />
<input name="ctl00$MainContent$TextBox2" type="text" value="Text box 2" id="MainContent_TextBox2" class="myclass" /><br />
<input name="ctl00$MainContent$TextBox3" type="text" value="Text box 3" id="MainContent_TextBox3" class="myclass" /><br />
<input type="submit" name="ctl00$MainContent$Button1" value="Button" id="MainContent_Button1" /><br />


<script type='text/javascript'>new Sys.WebForms.Menu({ element: 'NavigationMenu',     disappearAfter: 500, orientation: 'horizontal', tabIndex: 0, disabled: false });</script>

Ответы [ 2 ]

3 голосов
/ 15 марта 2012

Сначала я бы изменил ваш код .... чтобы упростить его, используйте class в элементе управления TextBox, затем выполните: 

$('.yourclass').blur(function () {
    $.ajax({
        type: "POST",
        url: document.location.pathname + '/Test',
        data: '{name: "' + $(this).val() + '" }',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (msg) {
            alert(msg.d);
        }
    });
});

Тогда вам не нужно создавать много-много blurметоды!

Вот пример - и в этом примере вы можете видеть, что метод blur отлично работает

0 голосов
/ 15 марта 2012 
$("#MainContent_TextBox1").bind('blur',function () {
            $.ajax({
                type: "POST",
                url: document.location.pathname + '/Test',
                data: '{name: "' + $("#MainContent_TextBox1").val() + '" }',
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (msg) {
                    alert(msg.d);
                }
            });
    });

    $("#MainContent_TextBox2").bind('blur',function () {

            $.ajax({
                type: "POST",
                url: document.location.pathname + '/Test',
                data: '{name: "' + $("#MainContent_TextBox2").val() + '" }',
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (msg) {
                    alert(msg.d);
                }
            });
    });
...