线样式修改

This commit is contained in:
2025-07-10 15:14:01 +08:00
parent 45f2d6f4eb
commit 11812253e6
5 changed files with 380 additions and 137 deletions

View File

@ -1,14 +1,14 @@
var legp = function (parentElement, ele) {
var legp = function (parentElement, ele, index = 0) {
let targetValue = null
return ({
that: Array.prototype.slice.call(parentElement.querySelectorAll(ele), 0),
stopPropagation: function (e) {
e = e || window.event;
if (e.stopPropagation) { //W3C阻止冒泡方法
if (e.stopPropagation) { //W3C阻止冒泡方法
e.stopPropagation();
}
else {
e.cancelBubble = true; //IE阻止冒泡方法
e.cancelBubble = true; //IE阻止冒泡方法
}
},
hide: function () {
@ -16,10 +16,14 @@ var legp = function (parentElement, ele) {
item.style.cssText += "display:none;";
});
},
show: function () {
legp(parentElement, ele).that.forEach(function (item) {
item.style.cssText += "display:block;";
});
show: function (num) {
if (num !== undefined) {
legp(parentElement, ele).that[num].style.cssText += "display:block;";
} else {
legp(parentElement, ele).that.forEach(function (item) {
item.style.cssText += "display:block;";
});
}
},
legp_searchList: function (name) {
let arr = [];
@ -28,19 +32,20 @@ var legp = function (parentElement, ele) {
});
return arr;
},
legp_search: function (tagData, search=false) {
var domId = legp(parentElement, ele).that[0];
legp_search: function (tagData, search = false) {
// var domId = legp(parentElement, ele).that[0];
var domId = legp(parentElement, ele).that[index];
if (!domId) {
return
}
var html = `<div class="cy_datalist"><i class="yj-custom-icon-arrow-down"></i>\n ${search ? '<input type="text" placeholder="\u8F93\u5165\u6216\u9009\u62E9" autocomplete="off">' : '<input type="text" class="datalist" readonly="readonly" placeholder="\u8bf7\u9009\u62e9" autocomplete="off">'}\n <dl style="display: none;position: absolute;background: rgba(0, 0, 0, 0.5);color: rgba(var(--color-sdk-base-rgb), 1);border: 1px solid rgba(var(--color-sdk-base-rgb), 0.2);border-radius: 3px;margin: 2px 0px;max-height: 300px;overflow-x: hidden;white-space: nowrap; font-size: 12px;z-index: 8;">\n </dl>\n </div>`;
var html = `<div class="cy_datalist"><i class="yj-custom-icon-arrow-down"></i>\n ${search ? '<input type="text" placeholder="\u8F93\u5165\u6216\u9009\u62E9" autocomplete="off">' : `<input type="text" class="datalist ${index}" readonly="readonly" placeholder="\u8bf7\u9009\u62e9" autocomplete="off">`}\n <dl style="display: none;position: absolute;background: rgba(0, 0, 0, 0.5);color: rgba(var(--color-sdk-base-rgb), 1);border: 1px solid rgba(var(--color-sdk-base-rgb), 0.2);border-radius: 3px;margin: 2px 0px;max-height: 300px;overflow-x: hidden;white-space: nowrap; font-size: 12px;z-index: 8;">\n </dl>\n </div>`;
domId.innerHTML = html;
// domId.appendChild(dom);
//获取当前广告
function myClick() {
legp(parentElement, ".cy_datalist dl dd").that.forEach(function (item) {
item.onclick = function (e) {
if(!this || !this.attributes) {
if (!this || !this.attributes) {
return
}
let value = this.attributes.value.value;
@ -68,39 +73,42 @@ var legp = function (parentElement, ele) {
}
//筛选
legp(parentElement, ".cy_datalist input").that[0].oninput = function () {
legp(parentElement, ".cy_datalist input").that[index].oninput = function (e) {
var val = this.value; //获取input值
// legp(parentElement, ".cy_datalist dl").hide();
legp(parentElement, ".cy_datalist dl").hide();
if (tagData.length > 0) {
legp(parentElement, ".cy_datalist dl").show();
var sear_1 = new RegExp(val);
var judge_1 = false;
legp(parentElement, ".cy_datalist dl").that[0].innerHTML = "";
legp(parentElement, ".cy_datalist dl").that[index].innerHTML = "";
tagData.forEach(function (item) {
if (sear_1.test(item.name)) {
judge_1 = true;
legp(parentElement, ".cy_datalist dl").that[0].innerHTML += "<dd class=\"" + ((targetValue === item.value) ? 'active' : '') + "\" style=\"margin: 0; padding: 5px 5px; color: #fff;cursor: pointer;\" value=\"" + item.value + "\">" + item.name + "</dd>";
legp(parentElement, ".cy_datalist dl").that[index].innerHTML += "<dd class=\"" + ((targetValue === item.value) ? 'active' : '') + "\" style=\"margin: 0; padding: 5px 5px; color: #fff;cursor: pointer;\" value=\"" + item.value + "\">" + item.name + "</dd>";
}
});
if (!judge_1) {
legp(parentElement, ".cy_datalist dl").that[0].innerHTML = "<dd style=\"padding: 10px 20px; color: #fff;\">\u6682\u65E0\u6570\u636E</dd>";
legp(parentElement, ".cy_datalist dl").that[index].innerHTML = "<dd style=\"padding: 10px 20px; color: #fff;\">\u6682\u65E0\u6570\u636E</dd>";
}
myClick();
}
};
//显示没被选择的
legp(parentElement, ".cy_datalist input").that[0].onclick = function (e) {
if(legp(parentElement, ".cy_datalist dl").that[0].style.display === 'none') {
legp(parentElement, ".cy_datalist input").that[index].onclick = function (e) {
legp(parentElement, ".cy_datalist dl").hide();
let num = e.srcElement.classList[1] * 1
num = num || 0
if (legp(parentElement, ".cy_datalist dl").that[num].style.display === 'none') {
if (tagData.length == 0) {
this.innerHTML = "暂无数据";
}
else {
legp(parentElement, ".cy_datalist dl").show();
legp(parentElement, ".cy_datalist dl").show(num);
}
legp(parentElement, ".cy_datalist dl").that[0].innerHTML = "";
legp(parentElement, ".cy_datalist dl").that[num].innerHTML = "";
tagData.forEach(function (item) {
legp(parentElement, ".cy_datalist dl").that[0].innerHTML += "<dd class=\"" + ((targetValue === item.value) ? 'active' : '') + "\" style=\"margin: 0; padding: 5px 5px; color: #fff;cursor: pointer;\" value=\"" + item.value + "\">" + item.name + "</dd>";
legp(parentElement, ".cy_datalist dl").that[num].innerHTML += "<dd class=\"" + ((targetValue === item.value) ? 'active' : '') + "\" style=\"margin: 0; padding: 5px 5px; color: #fff;cursor: pointer;\" value=\"" + item.value + "\">" + item.name + "</dd>";
});
myClick();
}