2012-04-22 34 views
21

Tôi sử dụng thay đổi (trình xử lý) để nghe thay đổi sự kiện thành vùng văn bản, nhưng tôi chỉ nhận được sự kiện khi văn bản mất tiêu điểm, nhưng tôi muốn nhận sự kiện ngay khi giá trị thay đổi.Thay đổi JQuery không kích hoạt cho đến khi mờ

$("#text_object").change(listener); 
function listener(dom){ 
alert("I'm not getting here before the textarea loses focus"); 
} 
+4

Có vẻ như bạn muốn 'khóa phím 'hoặc' khóa phím'. –

+0

Tôi đã thử khóa: http://stackoverflow.com/questions/10269571/form-event-incompatibilities-between-browsers-how-to-address –

Trả lời

22

Rất tiếc, trình duyệt chỉ nhận ra thay đổi khi trường bị làm mờ, vì vậy bạn có thể muốn thử gắn trình nghe keyup. Không phải là giải pháp thanh lịch nhất, thật không may.

Chi tiết tại http://api.jquery.com/keyup/.

+8

Khi sử dụng khóa, bạn có thể dán văn bản bằng chuột mà không cần kích hoạt sự kiện. – Oscar

6

bạn có thể thực hiện việc này. chỉ cần đảm bảo bạn cung cấp cho thẻ văn bản một thẻ id

$(document).ready(function(){ 
     $('.addtitle').keyup(function(event) { 
      if(event.keyCode==13) { 

} 
}); 
}); 

trong trường hợp của tôi ở đây, im kích hoạt chức năng trên phím enter (như các chức năng của facebook).

EDIT: còn nếu bạn có nhiều hơn thì một textarea trên một trang, bạn nên làm điều này:

$(document).ready(function(){ 
     $('textarea[name=mynamevalue]').keyup(function(event) { 
      if(event.keyCode==13) { 

} 
}); 
}); 
1

Dưới đây là những gì tôi làm:

/* Get the current value of the input and save it 
* in a data attribute before any change is made to it */ 
$(document).on('keydown','input', function(){ 
    $(this).data('value',$(this).val()); 
}); 

/* Compare the values after the keyup event*/ 
$(document).on('keyup','input', function(){ 
    if($(this).data('value') != $(this).val()){ 
    console.log($(this).attr('name')); 
    } 
}); 

Vì vậy, các "KeyDown" sự kiện là bắn trước khi nhấn phím thực sự thực hiện bất kỳ sửa đổi nào đối với phần tử được gọi, "keyup" được kích hoạt sau khi được kích hoạt. Vì vậy, tôi lấy giá trị trước và so sánh giá trị mới sau, sau đó tôi làm bất cứ điều gì tôi phải nếu có một sự thay đổi ..

Tôi hy vọng điều này sẽ giúp

5

theo câu trả lời đúng ở đây javascript change event on input element fires on only losing focus

bạn nên làm một cái gì đó như thế này

$('#name').on('change textInput input', function() { 
 
     
 
});

tuy nhiên tôi phát hiện ra rằng có cả textinput và các sự kiện đầu vào có thể gây ra sự kiện để bắn hai lần, bạn không muốn điều đó, vì vậy chỉ cần làm

$('#name').on('change input', function() { ...

+0

yup! đó là những gì tôi cần, hoạt động hoàn hảo trong chrome, nhưng tôi không biết làm thế nào nó hoạt động trên broswers khác –

+0

Làm việc như một say mê! Đây sẽ là câu trả lời được chấp nhận! – luizrogeriocn

0

i tạo này cho bạn, nó không phải là thanh lịch nhất giải pháp nhưng nó hoạt động

JS:

<script> 
$(document).ready(function (d) { 

    /* set initial value to "" (empty string), and not null 
     we're going to use this to check if the value of the current text field has been changed */ 
    val = ''; 

    setInterval(function() { 
     if (val !== $('textarea[name="checktext"]').val()) { 

      // Value is not the same, fire action 
      alert('val is different'); 

      // Update the current value 
      val = $('textarea[name="checktext"]').val(); 
     } else { 
      // Val is the same as textarea value 
     } 

    }, 50); 

}); 
</script> 

HTML:

<textarea name="checktext"></textarea> 

tập lệnh này sẽ chỉ hoạt động cho vùng văn bản cụ thể đó, bạn có thể thay đổi điều đó hoặc bạn có thể đặt val thành một mảng đầu vào văn bản.

Tôi chỉ cho bạn thấy ý tưởng đằng sau nó, sử dụng setInterval x mili giây để kiểm tra xem giá trị của đầu vào văn bản có giống với giá trị val hoặc bất kỳ tên biến nào bạn muốn sử dụng hay không. nếu chúng không phù hợp thì điều đó có nghĩa là nó đã bị thay đổi, nếu chúng khớp nhau thì điều đó có nghĩa là không có gì thay đổi.

tôi hy vọng bạn thấy điều này hữu ích.

Tuy nhiên HTML5 có giải pháp

<script> 
$(document).ready(function (d) { 

    $('textarea[name="checktext"]').on('input', function() { 
     alert('changed'); 
    }); 
}); 
</script> 
0

Câu hỏi này là cũ nhưng nó có thể giúp những người như tôi;)
Bạn setInterval() trong sự kiện đầu vào tập trung của bạn và có thể xóa khoảng thời gian này trong mờ và bạn có liên quan chức năng tôi nghĩ rằng đây là cách tốt để nắm bắt những thay đổi đầu vào của chính mình.
Ví dụ:

var myInterval; 
$("#text_object").focus(function (event) { 
    myInterval = setInterval(function() {    
     listener(event); 
    }, 100); 
}); 

$("#text_object").blur(function (event) { 
    clearInterval(myInterval); 
}); 

function listener(event){ 
    clearInterval(myInterval); 

    alert("I'm not getting here before the textarea loses focus"); 
} 

Hy vọng điều đó sẽ hữu ích.

Các vấn đề liên quan