Задать вопрос

antpv

Ответы пользователя по тегу JavaScript

  • Как сделать невозможным заполнять второй input, если первый пустой?

    @antpv 
    let first = document.getElementById('firstInput'); //первое поле
let two = document.getElementById('twoInput'); //второе поле

function preventInput(input) {
	input.addEventListener('keydown', handler)
}

function unPreventInput(input) {
	input.removeEventListener('keydown', handler)
}

function handler(e) {
	e.preventDefault();
}

preventInput(two);

first.addEventListener('change', function(e) {
	if (e.target.value == '') {
		preventInput(two);
	} else {
		unPreventInput(two);
	}
})


    Можно в событии change, заменить строчку с проверкой на такую:
    if (e.target.value.lenght < N)
    Тогда второе поле будет разблокировано после N символов в первом поле
    Ответ написан
    2 комментария
    2 комментария

  • Как в HTML JS проверять наличие какого-то нибудь слова?

    @antpv
    Рабочий пример:

    let input = document.body.firstElementChild;
    let arr = ['test']

    function findWord(input, arr, callback) {
        input.addEventListener('input', function (e) {
            arr.forEach(function(item, i, arr) {
                if (input.value.indexOf(item) >= 0) {
                    callback(item);
                }
            })
        })
    }


    function test(item) {
        alert(item)
    }

    findWord(input, arr, test)


    Вызываем функцию findWord
    Первый аргумент - input на котором проверять слова
    Второй агрумент - массив слов которые нужно проверить в input
    Третий аргумент - функция которая будет вызвана в случае если найдено слово, эта функция получит в качестве первого аргумента слово которое было найдено
    Ответ написан
    1 комментарий
    1 комментарий

  • После изменения css через JavaScript hover не работает, что делать?

    @antpv
    Если вы хотите чтобы :hover переопределил ваш собственный стиль, в :hover используйте !important.
    Например:

    #elem:hover{
        background-color: blue !important;
}
    Ответ написан
    1 комментарий
    1 комментарий

  • Почему не работает?

    @antpv
    Ты увеличиваешь значение переменной countFieldValue внутри функции changeCount, но не меняешь значение value в DOM. Я добавил функцию render, которая при клике будет обновлять value. Лучше конечно сразу внутри обработчиков это делать.

    function render() {
    countField.value = countFieldValue;
}

countMinus.addEventListener('click', function() {
    countFieldValue--;
    render()
});

countPlus.addEventListener('click', function() {
    countFieldValue++;
    render()
});
    Ответ написан
    2 комментария
    2 комментария

  • Как в jQuery определить ширину текста внутри input?

    @antpv
    Держи функцию. Не уверен что правильно понял вопрос, функция возвращает длинну текста внутри input, а если его нет то длинну placeholder.

    function getWidth(id) {
		let input = document.getElementById(id)
		let fontSize = getComputedStyle(input);
		let newSpan = document.createElement('span');
		newSpan.style.fontSize = fontSize;
		newSpan.style.margin = '0px';
		newSpan.style.padding = '0px';
		newSpan.innerHTML = input.value || input.getAttribute('placeholder');
		document.body.appendChild(newSpan);
		let width = newSpan.offsetWidth;
		newSpan.remove()
		return width;
	}

	let elem = document.getElementById('ID') //ID инпута
	let width = getWidth(elem) //переменная будет равна длинне в px
    Ответ написан
    Комментировать
    Комментировать