Question

我正在为谷歌分析构建一个Url-Generator。目前，如果我按下提交按钮，则会附加Url。但是我想在输入时键入URL。如何使用Javascript来摆脱提交按钮呢？

PS：我也希望如果我在第三个输入字段中进行更改，那么序列不会发生变化（第三个输入字段的内容最后没有附加，在我有之后改变了输入值。）

这是我的当前代码，即在按下提交按钮后输出的网址：

//create URL
submit.addEventListener("click", function() {
    outputField.value = "";
    output = "";
    //lowercases all field inputs
    if(input01.value !== "" && input02.value !== "") {
        output += input01.value + "?utm_source=" + input02.value;
        if(createClicked === false) {
            $("#outputWrapper").slideToggle(550);
            createClicked = true;
        }
    } else {
        alert("Website Url and Campaign Source can't be empty");
    }
    if(input03.value !== "") {
        output += "&utm_medium=" + input03.value;
    }
    if(input04.value !== "") {
        output += "&utm_campaign=" + input04.value;
    }
    if(input05.value !== "") {
        output += "&utm_term=" + input05.value;
    }
    if(input06.value !== "") {
        output += "&utm_content=" + input06.value;
    }
    //output.toLowerCase();
    //removes space through %20 in output
    output = output.replace(/\s/g,'%20');

    outputField.textContent = output;
})

Answer 1

将eventListener附加到input并听取input事件

＆＃13;

let myText = document.querySelector('#myText');
document.querySelector('#myInput').addEventListener('input', function(){
  myText.innerText = this.value;
});

＆＃13;

span{
  display : block;
}

＆＃13;

<input type="text" id="myInput" />

<span id="myText"></span>

＆＃13;

Javascript输入字段应附加在div whille Typing中

1 个答案: