Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 30.07.2016, 20:49
Аспирант
Отправить личное сообщение для Feex Посмотреть профиль Найти все сообщения от Feex
 
Регистрация: 30.12.2015
Сообщений: 84

Ошибка при замене части url при вводе через input
Доброго времени суток.
При вводе в ручную информации в поле ввода происходит какая-то ерудна, тяжело объяснить, это надо видеть.
Но, при вводе информации путем вставки скопированной информации (Ctrl+V) - всё нормально!
Подскажите, что не так. И, если можно, исправьте, пожалуйста.
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<style type="text/css">
body{
font-family: "Helvetica Neue",Arial,sans-serif;
font-size:17px;
}
.vydelit {
color: rgb(251, 72, 2);
}
</style>
</head>
<body>
<center>
<table id="demotable">
<thead><tr>
<td>IP: <input type="text" id="raz" value="31.47.177.168"/> Порт: <input type="text" id="raz2" value="4022"/>
</td>
</tr></thead>
<tbody>
<td><span>&lt;img src="</span>http://monitor.zone-game.info/check.php?do=status&ip=<b class="vydelit">31.47.177.168</b>&port=<b class="vydelit">4022</b>&id=33<span>"&gt;</span><br>
<img src="http://monitor.zone-game.info/check.php?do=status&ip=31.47.177.168&port=4022&id=33" />
</td>
</tbody>
</table> 
<script>
(function(){
var s = '31.47.177.168';
document.getElementById('raz').oninput = function() {
  var d = document.querySelector('#demotable tbody');
  d.innerHTML = d.innerHTML.replace(new RegExp(s,"g"), this.value);
  s = this.value;
}
})()
</script>
<script>
(function(){
var s = '4022';
document.getElementById('raz2').oninput = function() {
  var d = document.querySelector('#demotable tbody');
  d.innerHTML = d.innerHTML.replace(new RegExp(s,"g"), this.value);
  s = this.value;
}
})()
</script>
для примера скопируйте ip: 176.100.91.83 и Порт: 8881 и вставьте через Ctrl+V
</center>
</body>
</html>

Последний раз редактировалось Feex, 30.07.2016 в 21:26.
Ответить с цитированием
  #2 (permalink)  
Старый 30.07.2016, 21:04
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

Feex,
попробуйте указать кодировку
<meta charset="utf-8">
Ответить с цитированием
  #3 (permalink)  
Старый 30.07.2016, 21:28
Аспирант
Отправить личное сообщение для Feex Посмотреть профиль Найти все сообщения от Feex
 
Регистрация: 30.12.2015
Сообщений: 84

Сообщение от рони Посмотреть сообщение
Feex,
попробуйте указать кодировку
<meta charset="utf-8">
отредактировал пример - тот же результат. ввожу от руки в оба поля цифры, буквы, все перемешивается.. Через Ctrl+V все нормально.
Ответить с цитированием
  #4 (permalink)  
Старый 30.07.2016, 21:33
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

Feex,
возможно не учитываите множественную перезапись при вводе посимвольно
Ответить с цитированием
  #5 (permalink)  
Старый 30.07.2016, 21:36
Аспирант
Отправить личное сообщение для Feex Посмотреть профиль Найти все сообщения от Feex
 
Регистрация: 30.12.2015
Сообщений: 84

Если честно, я там ничего не учитываю) ибо мои познания так далеко не продвинулись.. Да и случайно вообще обнаружил этот баг, решил руками повводить и тут такое..
Ответить с цитированием
  #6 (permalink)  
Старый 30.07.2016, 21:42
Аспирант
Отправить личное сообщение для Feex Посмотреть профиль Найти все сообщения от Feex
 
Регистрация: 30.12.2015
Сообщений: 84

Это как-то можно исправить?
Ответить с цитированием
  #7 (permalink)  
Старый 30.07.2016, 21:50
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

Feex,
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<style type="text/css">
body{
font-family: "Helvetica Neue",Arial,sans-serif;
font-size:17px;
}
.vydelit {
color: rgb(251, 72, 2);
}
</style>
</head>
<body>
<center>
<table id="demotable">
<thead><tr>
<td>IP: <input type="text" id="raz" value="31.47.177.168"/> Порт: <input type="text" id="raz2" value="4022"/>
</td>
</tr></thead>
<tbody>
<td><span>&lt;img src="</span>http://monitor.zone-game.info/check.php?do=status&ip=<b class="vydelit">31.47.177.168</b>&port=<b class="vydelit">4022</b>&id=33<span>"&gt;</span><br>
<img src="http://monitor.zone-game.info/check.php?do=status&ip=31.47.177.168&port=4022&id=33" />
</td>
</tbody>
</table>
<script>
var inp = document.querySelectorAll('input'), v = document.querySelectorAll('.vydelit');
[].forEach.call(document.querySelectorAll('input'), function(item,i) {
        item.addEventListener('input', function() {
            v[i].textContent = item.value;
            var p = v[i].parentNode;
            p.querySelector('img').src = "http://monitor.zone-game.info/check.php?do=status&ip="+v[0].textContent+"&port="+v[1].textContent+"&id=33"
        });
    });
</script>
для примера скопируйте ip: 176.100.91.83 и Порт: 8881 и вставьте через Ctrl+V
</center>
</body>
</html>

Последний раз редактировалось рони, 30.07.2016 в 22:32.
Ответить с цитированием
  #8 (permalink)  
Старый 30.07.2016, 21:57
Аспирант
Отправить личное сообщение для Feex Посмотреть профиль Найти все сообщения от Feex
 
Регистрация: 30.12.2015
Сообщений: 84

Сообщение от рони Посмотреть сообщение
Feex,
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<style type="text/css">
body{
font-family: "Helvetica Neue",Arial,sans-serif;
font-size:17px;
}
.vydelit {
color: rgb(251, 72, 2);
}
</style>
</head>
<body>
<center>
<table id="demotable">
<thead><tr>
<td>IP: <input type="text" id="raz" value="31.47.177.168"/> Порт: <input type="text" id="raz2" value="4022"/>
</td>
</tr></thead>
<tbody>
<td><span>&lt;img src="</span>http://monitor.zone-game.info/check.php?do=status&ip=<b class="vydelit">31.47.177.168</b>&port=<b class="vydelit">4022</b>&id=33<span>"&gt;</span><br>
<img src="http://monitor.zone-game.info/check.php?do=status&ip=31.47.177.168&port=4022&id=33" />
</td>
</tbody>
</table>
<script>
var inp = document.querySelectorAll('input'), v = document.querySelectorAll('.vydelit');
[].forEach.call(document.querySelectorAll('input'), function(item,i) {
        item.addEventListener('input', function() {
            v[i].textContent = item.value;
            var p = v[i].parentNode;
            p.querySelector('img').src = "http://monitor.zone-game.info/check.php?do=status&ip="+v[1].textContent+"&port="+v[2].textContent+"&id=33"
        });
    });
</script>
для примера скопируйте ip: 176.100.91.83 и Порт: 8881 и вставьте через Ctrl+V
</center>
</body>
</html>
C вводом всё супер! Спасибо)
Только есть одно но, там при вводе и в адресе картинки заменились IP и порт. А теперь в адресе картинки ничего не меняется.
Ответить с цитированием
  #9 (permalink)  
Старый 30.07.2016, 22:08
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

Feex,
То что делает код вам понятно?
Ответить с цитированием
  #10 (permalink)  
Старый 30.07.2016, 22:14
Аспирант
Отправить личное сообщение для Feex Посмотреть профиль Найти все сообщения от Feex
 
Регистрация: 30.12.2015
Сообщений: 84

Сообщение от рони Посмотреть сообщение
Feex,
То что делает код вам понятно?
Ну, то, что он делает, это даже видно. Но как он это делает - я далековат еще от этого)
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Поменять фон при вводе в текст поле input teamf7 Элементы интерфейса 5 03.04.2016 21:28
Ошибка 500 при обращении через аякс imedia AJAX и COMET 1 04.07.2015 14:08
Замена части url через js NOLDOR123 Общие вопросы Javascript 2 15.05.2013 05:42
Как проигнорировать определенные символы при вводе в поле input? nraw Events/DOM/Window 6 24.07.2012 17:17
При добавлении DOCTYPE "плывут" размеры input type=text Demath (X)HTML/CSS 4 08.07.2012 19:27