Javascript на пасте заменить все

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

<!DOCTYPE html>
<html>
<body>

<input id="pc" type="text" contenteditable="true" onpaste="myFunction()" size="60" >


<script>
function myFunction() {
 var e=document.getElementById("pc"); 
 setTimeout(function(){alert(e.value);}, 45);
 var x = document.getElementById("pc").value;
 alert(x);
 var s = x.replaceAll(" ",",");
 alert(s);

 document.getElementById("pc").value = s;
}
</script>
</body>
</html>

Мое первое предупреждение печатается пустым. Второе предупреждение (alert (x)) также пустое. Третье предупреждение (оповещение) распечатать текст, который я пытаюсь вставить.

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

2 ответа

Этот ответ использует Jquery:

Вы можете сначала привязать к paste событие в текстовом вводе, а затем захватить результат события вставки в переменную. Затем, чтобы заменить пробелы запятыми, вам просто нужно очень простое регулярное выражение: data.replace(new RegExp(' ', 'g'), ','), который заменяет каждый пробел запятой.

$('#pc').bind('paste', function(e) {
    var data = e.originalEvent.clipboardData.getData('Text');
    data = data.replace(new RegExp(' ', 'g'), ',');
    alert(data);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>

<body>

  <input id="pc" type="text" contenteditable="true"size="60">


</body>

</html>

Первое предупреждение находится в другой области, поэтому значение e.value не определено, поскольку в его текущей области значение не определено. Второе предупреждение пустое, потому что событие вызывается при вставке, а не после вставки, и поэтому при вставке значение не обновляется, поэтому перед вставкой отображается предыдущее значение. Третья вставка напрямую изменяет значение, поэтому новое значение используется. Возможно, вы захотите попробовать проверить событие keyup для Ctrl+V, если хотите, чтобы другие два оповещения работали правильно.

<input id="pc">
<script>
window.onload = function() {
    document.getElementById('pc').onkeyup = function(e) {
        this.value = this.value.replace(/ /g,',');
    }
}
</script>
Другие вопросы по тегам