简体   繁体   English

将url /文本按空格分成2个框Javascript仅无库

[英]Split urls/text by spaces into 2 boxes Javascript Only no libraries

Well so far i havent been able to get it to change the input box value. 到目前为止,我还无法获得它来更改输入框的值。 What i want it to do? 我想要它做什么? I want it to take the text from the first box. 我希望它从第一个方框中提取文本。 And when you click the button splits it and appends them to the 2nd and 3rd box. 当您单击按钮时,会将其拆分,并将其附加到第二个和第三个框中。

I don't want to use jquery or any libraries purely javascript. 我不想使用jquery或任何纯JavaScript的库。

Any questions ask away. 任何问题都会消失。

Not sure what im doing wrong here. 不知道我在这里做错了什么。 Seems it should work. 似乎应该可以。 Any help? 有什么帮助吗? Thanks Edited this is working for what i need.... not sure if its the best way but it does work Code 谢谢编辑,这是我需要的工作。...不确定是否是最好的方法,但是它确实可以工作

    <HTML>
    <HEAD> 
    <SCRIPT LANGUAGE="JavaScript">
        var urls_1;
        var split_text;
    function addto_boxes(form) {
            var split_text = document.getElementById("text_to_split").value;
            var urls_1 = split_text.split(" ", 100000);
            document.getElementById("input_box1").value = document.getElementById("input_box1").value + urls_1[0] + " ";
            document.getElementById("input_box2").value = document.getElementById("input_box2").value + urls_1[1] + " ";
    }


    </SCRIPT>
    </HEAD>
    <BODY>
    <input id="Split" type="button" value="Add to boxes" onclick="addto_boxes(this.form);"/><Br>
    <textarea NAME="texttosplit" id="text_to_split" VALUE="" rows="4" cols="75"></textarea><Br>


    <FORM NAME="myform" ACTION="" METHOD="GET">Put 1st urls in this box:
    <textarea NAME="inputbox" id="input_box1" VALUE=""rows="4" cols="75"></textarea><Br>
    Put 2nd urls in this box: <Br>
    <textarea NAME="inputbox2" id="input_box2" VALUE=""rows="4" cols="75"></textarea><Br>
    <INPUT TYPE="reset">
    </FORM>
    </BODY>
    </HTML>

This should work for you 这应该为你工作

HTML 的HTML

<input id="Split" type="button" value="Add to boxes" />
<Br>
<textarea NAME="texttosplit" id="text_to_split" VALUE="" rows="4" cols="75"></textarea>
<Br>
<FORM NAME="myform" ACTION="" METHOD="GET">Put 1st urls in this box:
    <textarea NAME="inputbox" id="input_box1" VALUE="" rows="4" cols="75"></textarea>
    <Br>Put 2nd urls in this box:
    <Br>
    <textarea NAME="inputbox2" id="input_box2" VALUE="" rows="4" cols="75"></textarea>
    <Br>
    <INPUT id="reset" TYPE="reset">
</FORM>

Javascript Java脚本

var aBox1 = [];
var aBox2 = [];

document.getElementById("Split").addEventListener("click", function () {
    var urls_1 = document.getElementById("text_to_split").value.trim().split(" "),
        url1 = urls_1[0] || "",
        url2 = urls_1[1] || "";

    if (url1.length) {
        aBox1.push(url1);
    }

    if (url2.length) {
        aBox2.push(url2);
    }

    document.getElementById("input_box1").value = aBox1.join(" ");
    document.getElementById("input_box2").value = aBox2.join(" ");
}, false);

document.getElementById("reset").addEventListener("click", function () {
    aBox1.length = 0;
    aBox2.length = 0;
}, false);

On jsfiddle jsfiddle上

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM