如何动态将option选框中的值传入前一个input节点

12style
  • 38

油猴鼠标拖拽脚本设置界面,新增功能,搜索引擎文本框和下拉框,默认选中第一个选项,input文本框为空,可以在控制台输出动态onchange选中后的值,如何动态选中,值传入input文本框

设置界面中的case: selec中:
argValue[i]为默认设置功能的值
options[selectName][k]为下拉选框列表的值

Alt+Y进入设置界面
测试脚本代码
https://greasyfork.org/zh-CN/...

设置界面

function arg2html(argument, type, trk){
    let html ="",
        argu, i,rand, trackTxt, name,
        argValue = [],
        agrDetail = [],
        description,
        selectName;
    if(typeof argument === "object")
        argu = argument;
    else
        argu = JSON.parse(argument);
    trackTxt = trk || '';
    name = argu.name;

    html += `<span>${name}</span><span name="alias">${argu.alias ? argu.alias : local[type][name][cfg.language]}</span><b style="visibility:${argu.arg.length ? "visible" : "hidden"};" name="toggleArgument">▲</b><input type="text" name="${name}" value="${trackTxt}" data-mark="${type}" readonly="readonly"><br/><div class="fnArgument">`;
    if(argu.arg.length > 0){
        argValue = trackTxt ? argu.arg : [];
        agrDetail = fnLocal.arg[name].arg;
        description = fnLocal.arg[name].description[cfg.language];

        for(i in agrDetail){
            rand = Math.floor(Math.random()*1000);
            switch (agrDetail[i].slice(0,5)) {
                case 'input':
                    html += '<span><input type="text"><i></i></span>';
                    break;
                case 'selec':
                    selectName = agrDetail[i].split(':').pop();
                    html += `<span><input type="text" value=${argValue[i] || ''}><select name="fnSelect" onchange="console.log(this.options[this.options.selectedIndex].value);">`;
                    for (let k in options[selectName]){
                        html += `<option value=${options[selectName][k]} ${sel(argValue[i], options[selectName][k])}>${k}</option>`;
                    }
                    html += '</select></span>';
                    break;
                default:
                    html = `<span style="visibility:hidden;"></span>`;
                    break;
            }
        }
    }
    return html + "</div>";
}

下拉选框

options = {
        imgSearchEnging: {// image searching
            Baidu:   "https://graph.baidu.com/details?isfromtusoupc=1&tn=pc&carousel=0&promotion_name=pc_image_shituindex&extUiData%5bisLogoShow%5d=1&image=U-R-L",
        },
        searchEnging: {// text searching
            Baidu:   "https://www.baidu.com/s?wd=",
            Google:  "https://www.google.com/search?q=",
        },
        foreGround: {

            前台:    "ture",
            后台:    "false",
        },
        nextTab: {
            右侧:    "ture",
            后端:    "false"
        }
    };

设置功能对应选项

        fnLocal = {
            arg: {
                openLink:{
                    description:{zh:['前台打开', '右侧打开'], en:['Load In Foreground', 'Open in Next Tab']},
                    arg:['select:foreGround', 'select:nextTab']
                },
                openImgURL:{
                    description:{zh:['前台打开', '右侧打开'], en:['Load In Foreground', 'Open in Next Tab']},
                    arg:['select:foreGround', 'select:nextTab']
                },
                openImgLink:{
                    description:{zh:['前台打开', '右侧打开'], en:['Load In Foreground', 'Open in Next Tab']},
                    arg:['select:foreGround', 'select:nextTab']
                },
                searchText:{
                    description:{zh:['搜索引擎', '前台打开', '右侧打开'], en:['SearchingEnging', 'Load In Foreground', 'Open in Next Tab']},
                    arg:['select:searchEnging', 'select:foreGround', 'select:nextTab']
                },
                searchImg:{
                    description:{zh:['图片搜索引擎', '前台打开', '右侧打开'], en:['Image SearchingEnging', 'Load In Foreground', 'Open in Next Tab']},
                    arg:['select:imgSearchEnging', 'select:foreGround', 'select:nextTab']
                }
            },
回复
阅读 434
1 个回答
✓ 已被采纳

previousElementSibling 属性返回指定元素的前一个兄弟元素
监听select的change事件,在change时把值传给上一个元素不就行了?

function handleChange(e){
    e.target.previousElementSibling.value = e.target.value
}
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
你知道吗?

宣传栏