Помогите пожалуйста. Имею поле поиска и объект:
// Перебираю атрибут name у кнопок и добавляю их в объект
let elements = document.querySelectorAll('.btn');
let objects = {};
for (let i = 0; i < elements.length; i++) {
const button = elements[i];
objects[[button.name]] = {
name: button.name
};
}
// Создаю поиск
var form = document.querySelector('#search');
form.addEventListener('submit', function(event) {
event.preventDefault();
var data = new FormData(form);
var num = data.get('num');
console.log(num)
var numfull = data.get('num')
if (objects[num]) {
console.log(objects[num]);
// document.location.replace(objData2[num]);
} else if (objects[numfull]) {
console.log(objects[numfull]);
} else {
console.log('Not found');
}
});
<div class="search">
<form id="search">
<input type="text" name="num" placeholder="Search">
<button type="submit">Submit</button>
</form>
</div>
Например есть объект
{
N01 - Number 01: {name: "N01 - Number 01"}
N15 - Number 15: {name: "N15 - Number 15"}
}
В поиске ввели число 15 в консоли отобразился объект {name: "N15 - Number 15"}
, ввели число 01 в консоли отобразился объект {name: "N01 - Number 01"}
.
Любая помощь будет полезна, заранее спасибо.
Предлагаю такой вариант.
var object = {
"N01 - Number 01": {name: "N01 - Number 01"},
"N15 - Number 15": {name: "N15 - Number 15"}
};
var form = document.querySelector('#form-search');
form.onsubmit = function(){
var value = this.querySelector('#form-input-search').value.trim();
var valid = null;
if(value.match(/^\N[0-9]+.+[0-9]+$/)){
valid = value.match(/^\N[0-9]+.+[0-9]+$/);
} else {
var source = "N{{search}} - Number {{search}}";
source = source.replace(/{{search}}/g, value);
valid = source.match(/^\N[0-9]+.+[0-9]+$/);
}
if(valid){
if(object[valid]){
console.log(object[valid]);
} else {
console.log("поиск не дал результатов");
}
} else {
console.log("неверный формат");
}
return false;
}
<form id="form-search">
<input type="text" id="form-input-search">
<button>Поиск</button>
</form>
Нужно добавить плавность для открытия tab-аЕсть блок, при клике на li класса "advantages-col" появляется нижний div блок класса "panel"
Столкнулся с такой проблемой: Что бы закрыть дроп при клике ИМЕННО на последнем элементе требуется двойной клик, на все остальных элементах...