2013-05-03 41 views
-2

很好地编辑这与东西看起来好多了,多亏了托马斯W的一个很好的例子。我只是稍微改变了它,但现在看起来工作得很好。而托马斯现在已经学习并理解了一种新的方式来做某件事,我不会再以另一种方式去做。 :)即将更改clearbox(表单)中的代码。Javascript问题与正确的文本到文本区域的地方文本

感谢

<HTML> 
<HEAD> 
<SCRIPT LANGUAGE="JavaScript"> 
window.onload = function(){ 
     windows1.style.fontWeight = "bold"; 
     windows1.style.fontSize = "12pt"; 
     changetabs(1) 
     } 
var split_text; 
var urls_1; 
var numbercount=0; 
var totals; 
var check_time; 
var wait = 0; 
var itemCounter = 0; 
var tabs=1; 
var tabspicked=1; 

    function addto_boxes(form) { 
     split_text = document.getElementById("text_to_split").value; 
     urls_1 = split_text.split(" ", 100000); 
     totals = urls_1.length-1; 
     var boxNum = 1; 
     var x=0; 
     while (x <= totals -1) { 
      var box = document.getElementById("input_box"+boxNum); 
      box.value = box.value + urls_1[x] + " "; 
      boxNum += 1; 
      if (boxNum > tabspicked) boxNum = 1; 
      x++; 
      clearbox(this.form) 
     } 
    } 


    function clearbox(form) { 
    document.getElementById("text_to_split").value = ""; 
    var input_box = document.getElementById("input_box1").value; 
    var input_box_2 = document.getElementById("input_box2").value; 
    var input_box_3 = document.getElementById("input_box3").value; 
    var input_box_4 = document.getElementById("input_box4").value; 
    var input_box_5 = document.getElementById("input_box5").value; 
    var input_box_6 = document.getElementById("input_box6").value; 
    var input_box_7 = document.getElementById("input_box7").value; 
    var input_box_8 = document.getElementById("input_box8").value; 
    var input_box_9 = document.getElementById("input_box9").value; 
    var input_box_10 = document.getElementById("input_box10").value; 
    urls = input_box.split(" ", 100000); 
    urls2 = input_box_2.split(" ", 100000); 
    urls3 = input_box_3.split(" ", 100000); 
    urls4 = input_box_4.split(" ", 100000); 
    urls5 = input_box_5.split(" ", 100000); 
    urls6 = input_box_6.split(" ", 100000); 
    urls7 = input_box_7.split(" ", 100000); 
    urls8 = input_box_8.split(" ", 100000); 
    urls9 = input_box_9.split(" ", 100000); 
    urls10 = input_box_10.split(" ", 100000); 
    document.getElementById("box1").innerHTML = urls.length-1; 
    document.getElementById("box2").innerHTML = urls2.length-1; 
    document.getElementById("box3").innerHTML = urls3.length-1; 
    document.getElementById("box4").innerHTML = urls4.length-1; 
    document.getElementById("box5").innerHTML = urls5.length-1; 
    document.getElementById("box6").innerHTML = urls6.length-1; 
    document.getElementById("box7").innerHTML = urls7.length-1; 
    document.getElementById("box8").innerHTML = urls8.length-1; 
    document.getElementById("box9").innerHTML = urls9.length-1; 
    document.getElementById("box10").innerHTML = urls10.length-1; 
    document.getElementById("displaytotal").innerHTML = urls.length-1 + urls2.length-1 + urls3.length-1 + urls4.length-1 + urls5.length-1 + urls6.length-1 + urls7.length-1 + urls8.length-1 + urls9.length-1 + urls10.length-1; 
    } 

    function bold_selected_tab(tab_to_bold) { 
     document.getElementById("windows1").style.fontSize = "10pt"; 
     document.getElementById("windows2").style.fontSize = "10pt"; 
     document.getElementById("windows3").style.fontSize = "10pt"; 
     document.getElementById("windows4").style.fontSize = "10pt"; 
     document.getElementById("windows5").style.fontSize = "10pt"; 
     document.getElementById("windows6").style.fontSize = "10pt"; 
     document.getElementById("windows7").style.fontSize = "10pt"; 
     document.getElementById("windows8").style.fontSize = "10pt"; 
     document.getElementById("windows9").style.fontSize = "10pt"; 
     document.getElementById("windows10").style.fontSize = "10pt"; 

     document.getElementById("windows1").style.fontWeight = "normal"; 
     document.getElementById("windows2").style.fontWeight = "normal"; 
     document.getElementById("windows3").style.fontWeight = "normal"; 
     document.getElementById("windows4").style.fontWeight = "normal"; 
     document.getElementById("windows5").style.fontWeight = "normal"; 
     document.getElementById("windows6").style.fontWeight = "normal"; 
     document.getElementById("windows7").style.fontWeight = "normal"; 
     document.getElementById("windows8").style.fontWeight = "normal"; 
     document.getElementById("windows9").style.fontWeight = "normal"; 
     document.getElementById("windows10").style.fontWeight = "normal"; 
     tab_to_bold.style.fontWeight = "bold"; 
     tab_to_bold.style.fontSize = "12pt"; 
    } 

    function changetabs(tabs) { 
     document.getElementById("tabesselected").innerHTML = tabs; 
     tabspicked = tabs; 
    } 


</SCRIPT> 
</HEAD> 
<BODY> 
Select Number of tab to use. Tabs selected <b><span style="font-size:12pt" id="tabesselected"></span><br></b> 
<input type="button" id="windows1" style="height: 24px; width: 72px" value="Tabs: 1" onclick="changetabs(1);bold_selected_tab(windows1);" />&#160; 
<input type="button"id="windows2" style="height: 24px; width: 72px" value="Tabs: 2" onclick="changetabs(2);bold_selected_tab(windows2);" />&#160; 
<input type="button"id="windows3" style="height: 24px; width: 72px" value="Tabs: 3" onclick="changetabs(3);bold_selected_tab(windows3);" />&#160; 
<input type="button"id="windows4" style="height: 24px; width: 72px" value="Tabs: 4" onclick="changetabs(4);bold_selected_tab(windows4);" />&#160; 
<input type="button"id="windows5" style="height: 24px; width: 72px" value="Tabs: 5" onclick="changetabs(5);bold_selected_tab(windows5);" />&#160; 
<input type="button"id="windows6" style="height: 24px; width: 72px" value="Tabs: 6" onclick="changetabs(6);bold_selected_tab(windows6);" />&#160; 
<input type="button"id="windows7" style="height: 24px; width: 72px" value="Tabs: 7" onclick="changetabs(7);bold_selected_tab(windows7);" />&#160; 
<input type="button"id="windows8" style="height: 24px; width: 72px" value="Tabs: 8" onclick="changetabs(8);bold_selected_tab(windows8);" />&#160; 
<input type="button"id="windows9" style="height: 24px; width: 72px" value="Tabs: 9" onclick="changetabs(9);bold_selected_tab(windows9);" />&#160; 
<input type="button"id="windows10" style="height: 24px; width: 72px" value="Tabs 10" onclick="changetabs(10);bold_selected_tab(windows10);" /><br><br> 
<input id="Split" type="button" value="Add to boxes" onclick="addto_boxes(this.form);"/>____<input id="clearbutton" type="button" value="Clear" onclick="clearbox(this.form);"/><Br><br> 
Paste urls into this box and click add to boxes<br> 
<textarea NAME="texttosplit" id="text_to_split" VALUE="" rows="4" cols="75"></textarea><br><br><br><br> 


<FORM NAME="myform" ACTION="" METHOD="GET"> 
<textarea NAME="inputbox" id="input_box1" VALUE="" rows="2" cols="5"></textarea> 
<textarea NAME="inputbox2" id="input_box2" VALUE="" rows="2" cols="5"></textarea> 
<textarea NAME="inputbox3" id="input_box3" VALUE="" rows="2" cols="5"></textarea> 
<textarea NAME="inputbox4" id="input_box4" VALUE="" rows="2" cols="5"></textarea> 
<textarea NAME="inputbox5" id="input_box5" VALUE="" rows="2" cols="5"></textarea><br> 
<textarea NAME="inputbox6" id="input_box6" VALUE="" rows="2" cols="5"></textarea> 
<textarea NAME="inputbox7" id="input_box7" VALUE="" rows="2" cols="5"></textarea> 
<textarea NAME="inputbox8" id="input_box8" VALUE="" rows="2" cols="5"></textarea> 
<textarea NAME="inputbox9" id="input_box9" VALUE="" rows="2" cols="5"></textarea> 
<textarea NAME="inputbox10" id="input_box10" VALUE="" rows="2" cols="5"></textarea><br> 
<INPUT TYPE="reset"> 
</FORM> 
</BODY> 
</HTML> 

也感谢托马斯,因为你的例子我也能够改变功能bold_selected_tab()来。我想即时掌握它。现在,如果clearbox(表单)函数看起来像下面那样。

function bold_selected_tab(tab_to_bold) { 
     var x=1; 
     while (x <= 10) { 
      var box = document.getElementById("windows"+x); 
      box.style.fontSize = "10pt "; 
      x++; 
     } 

     var x=1; 
     while (x <= 10) { 
      var box = document.getElementById("windows"+x); 
      box.style.fontWeight = "normal"; 
      x++; 
     } 

     tab_to_bold.style.fontWeight = "bold"; 
     tab_to_bold.style.fontSize = "12pt"; 
    } 
+0

你需要使用循环和数组,而不是这种石器时代的重复。这是严重的结构(缺乏结构)。你有10个按钮,10个textareas,所有代码重复10次..这太可怕了。 – 2013-05-03 01:36:24

+0

当*你*明显是初学者时,不要忽视JQuery,并且不知道你在做什么。这里不是问题,但你应该选择它 - 用它编码,比没有它更简单和更可靠。 – 2013-05-03 01:38:23

+0

托马斯。不管它是否是否定的......这是一个办法。只是告诉我使用循环和数组并不能帮助我。无论如何,这是个人用途......我并不担心它如何“看起来”。只需要它正常工作。还要注意,这是为了一个更大的项目...所以数组意味着整个重新编码。但是你没有考虑到这一点?什么也没有。 – 2013-05-03 01:58:03

回答

1

当我说循环&数组,我的意思是不重复你的内部块10次。

var doneChecking = false; 
for (var tab = 1; tab <= 10 && ! doneChecking; tab++) { 
    if (tabspicked >= tab) { 
     if (numbercount >= totals){ 
      numbercount = 0; 
      clearbox(this.form); 
      doneChecking = true; 
      break; 
     } 
     if (numbercount <= totals){ 
      var elementId = "input_box"+tab; 
      var urlIndex = numbercount + tab - 1; // why? 
      document.getElementById(elementId).value = document.getElementById(elementId).value + urls_1[ urlIndex] + " "; 
     } 
    } 
} 

越早编写这个干净&得当,越早你就会明白你实际上要怎样做。你可以选择尝试&学习这个东西,或不。由你决定。

如果您尝试在N个文本框中分配空格分隔的输入字符串,则可以这样做。

var boxNum = 1; 
var numBoxes = tabspicked; // are these Boxes or Tabs? I'm calling them Boxes. 
for (var url : urls_1) { 
    // add to Current Box. 
    var box = document.getElementById("input_box"+boxNum); 
    box.value = box.value + urls + " "; 

    // advance Box, rotating around the N boxes. 
    boxNum += 1; 
    if (boxNum > numBoxes) boxNum = 1; 
} 

这应该是一个简单的方法。看看你如何去做。

+0

好吧,我们都不能只是神奇地知道如何编码所有干净整洁等。这与实践和应用程序。你觉得我在做什么?此外,那个答案甚至没有做任何我能看到的事情。至少我笨拙的代码实际上给了我一些结果。但谢谢你的尝试。 – 2013-05-03 03:40:36

+0

我的错误。错过了一些东西。 :)但它不会继续添加东西到第一个盒子,如果你选择少于10:P例如。键入b c d e f g并选择3,它只会将b c放入前3个框然后停止...所以说说我。 – 2013-05-03 03:51:29

+0

那是我可以理解的方法。试图找出如何去做。我发布的方法是有效的。第一个想到的。似乎无法让第二个人工作。不知道我做错了什么。在没有任何东西正在工作的情况下添加该部分之后... :(需要声明的所有东西都已经被声明了 – 2013-05-03 05:26:44