как правильно выполнить оператор if после события bind()
он появляется мой код обыкновения выполнять, если выражение о первоначальной paste
из Youtube ссылки в моем поле ввода.
вот мой http://jsfiddle.net/6Z3xP/1/
это работает только тогда, когда я вставляю ссылку дважды подряд.
$(document).ready(function () {
var textval = $('#input');
var youtube = /(?:youtube\.com\/(?:[^\/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=)|youtu\.be\/)([^"&?\/ ]{11})/i;
$("#input").bind('paste', function () {
if (youtube.test(textval.val())) {
var yurl = textval.val().match(youtube)[0];
alert(yurl);
}
});
});
Я попытался добавить $(document).ready(function()
сразу после привязки, но я не могу заставить его работать.
background info: я хочу захватить URL-адрес youtube при вставке ссылки с YouTube на пользователя
Значение входа не сразу доступно при запуске события вставки, вам необходимо мгновенно отложить свой код, чтобы он стал доступен.
Скрипт: http://jsfiddle.net/8Pvr4/1/
Единственное изменение заключается в том, что код в вашем обратном вызове привязки теперь завернут в:
setTimeout(function() {
},0);
Более надежным методом было бы получить значение из объекта события через:
e.originalEvent.clipboardData.getData('text/plain');
поэтому ваша привязка станет:
$("#input").bind('paste', function(e) {
var val = e.originalEvent.clipboardData.getData('text/plain');
if (youtube.test(val)) {
var yurl = val.match(youtube)[0];
alert(yurl);
}
});
Скрипт: http://jsfiddle.net/8Pvr4/3/
То, как вы думаете, "вставить" событие работает, на самом деле это не так. Событие вставки просто вызывает то, что что-то вставляет из буфера обмена. Он не предоставляет данные, которые вставляются. Конечно, вы можете получить к нему доступ из буфера обмена, но Javascript ограничил доступ к буферу, и вам нужно позаботиться об этом немного по-другому. Посмотрите эти два потока, и вы поймете, как это сделать
Надеюсь, поможет.
Проблема заключается в том, что событие вставки происходит до ввода текста:
В JQuery Как обращаться с пастой?
Вот исправленная скрипка. Он выполняет операцию, указанную вами только при вставке данных во входные данные.
$(document).ready(function () {
var textval = $('#input');
var youtube = /(?:youtube\.com\/(?:[^\/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=)|youtu\.be\/)([^"&?\/ ]{11})/i;
var pasting = false;
$("#input").bind('paste', function () {
pasting = true;
});
$("#input").bind('propertychange input', function () {
if(!pasting) {
return;
}
pasting = false;
if (youtube.test(textval.val())) {
var yurl = textval.val().match(youtube)[0];
alert(yurl);
}
});
});
originalEvent
могли бы вы мне объяснить, как эта частьvar val = e.originalEvent.clipboardData.getData('text/plain');
действительно работает? Благодарю.originalEvent
, которое действует как проход для любого запускаемого браузером. Получив исходное событие вставки, вам просто нужно знать правильные свойства для доступа к / методам вызова, чтобы получить то, что вы ищете, информацию о которой можно найти здесь.