Хочу сделать скрипт для получения доп.данных пользователя и упростить вставку URL для пользователей. Есть код
<input class="input" type="text" name="id" size="33" required>
И например пользователь вводит ссылку на страницу:
https://vk.com/durov
Из этой ссылки мне нужно выбрать durov. Как реализовать такое? Знаю, что это просто, но пока не знаю как :(
С помощью регулярного выражения вы может отбросить лишнюю часть url страницы:
document.getElementById('get').addEventListener("click", function() {
var pageId = document.getElementById('pageUrl').value.replace(/^https?\:\/\/vk\.com\/(\w+)\/?/, '$1');
alert(pageId);
});
<input class="input" type="text" name="id" size="33" id="pageUrl" required>
<input id="get" value="Получить" type="button" />
Начать с того, что нужно получить текст из input
-элемента. Способов очень много, возьмем какой-нибудь простой, я придерживаюсь получения элемента по идентификатору, поэтому добавил бы атрибут идентификатора:
<input class="input" type="text" name="id" id="myInput" size="33" required>
Просто добавил id="myInput"
, идентификаторы как никак вносят некую уникальность. После чего получу данный элемент и его значение в js-скрипте:
var inputValue = document.getElementById("myInput").value;
Вот хороший ответ по получению значения текста из input
с enSO: JavaScript: how to get value of text input field?. Текст из поля ввода есть, теперь возьмем то, что нам нужно в этом тексте. Опять же - способов много, если с регулярками не знакомы, то можно старым добрым substr
и lastIndexOf
var result = inputValue.substr(inputValue.lastIndexOf("/") + 1);
Внутри функции substr
+1 - для того, чтобы слэш не попал в результат.
function showResult(){
var inputValue = document.getElementById("myInput").value;
var result = inputValue.substr(inputValue.lastIndexOf("/") + 1);
alert(result);
}
<input class="input" type="text" name="id" id="myInput" size="33" required>
<button onclick="showResult()">Результат</button>
Метод substr()
возвращает указанное количество символов из строки, начиная с указанной позиции, если второй параметр не указан, то вернет все символы с указанной позиции до конца строки. Метод lastIndexOf()
возвращает индекс последнего вхождения указанного значения в строку.
Кофе для программистов: как напиток влияет на продуктивность кодеров?
Рекламные вывески: как привлечь внимание и увеличить продажи
Стратегії та тренди в SMM - Технології, що формують майбутнє сьогодні
Выделенный сервер, что это, для чего нужен и какие характеристики важны?
Современные решения для бизнеса: как облачные и виртуальные технологии меняют рынок
Здравствуйте
Всем приветЕсть выпадающее меню со структурой Родитель > Ребенок уровень-1 > Ребенок уровень-2