输入不显示

我有一个输入字段。当用户点击它时，一些JavaScript将文本转换为Raphael JS库变量。我想把每个字母放入一个称为字符串的Raphael变量，然后是\ n。当用户点击按钮时，什么都不显示。有人可以帮我解决这个问题吗？...输入不显示

<html> 
    <head> 
    <script src="raphael.js"></script> 
    <script src="jquery-1.7.2.js"></script> 
    <script type="text/javascript"> 
    var string = ""; 
    function animate() { 

    var txt = document.getElementById("words").value; 
    var splittxt = txt.split(""); 

     var i; 
     for (i = 0; i < splittxt.length; i++) { 
     var string = splittxt[i] + "\n\n"; 

     } 
     }  

     </script> 
     <style type="text/css"> 
     #letters 
     { 
     text-align:center; 
     margin-left:10px; 
     width:25px; 
     float:left; 
     text-shadow:10px 5px 1px #4D4D4D; 
     filter:DropShadow(Color=#4D4D4D, OffX=10, OffY=5); 
     font-weight:bold; 
     } 

     </style> 

     </head> 

     <body> 

     Text: <input type="text" id="words" /> 
     <input type="button" value="Animate" onclick="animate()" /> 
     <div id='letters'></div> 
     <div id="draw-here-raphael" style="height: 200px; width: 400px; margin-top:0px; background-color:blue;"> 
     </div> 
     <div id="elps" style="ma 

rgin-left:100px;"/> 

    <script type="text/javascript"> //all your javascript goes here 
    var r = new Raphael("draw-here-raphael"); 
    var string = r.text(50,50, string); 
    </script> 

    </body> 
    </html>

来源

2012-07-23 John Doe

“input”这个词的'value'是空白的！正常？ – mabbas 2012-07-23 14:52:32

我拿出了价值部分，但它仍然不起作用。你知道为什么吗？？ – 2012-07-23 14:55:27

而不是设置变量字符串，你要添加到它。另外，还有其他更新，我对你的摘录做了...

将变量设置为保留字也会导致很多问题。

http://jsfiddle.net/fN9Me/

<html> 
    <head> 
    <script src="raphael.js"></script> 
    <script src="jquery-1.7.2.js"></script> 
    <script type="text/javascript"> 
     var alpha = ""; 
     var something = ""; 
     var r = ""; 
     var txt = ""; 
     var splittxt = ""; 

     $(function() { 
      r = new Raphael("draw-here-raphael"); 

      $("#animate").click(function() { 
       txt = $("#words").val(); 
       splittxt = txt.split(""); 

       var i; 
       for (i = 0; i < splittxt.length; i++) { 
        something += splittxt[i] + "\n\n"; 
       } 
       alpha = r.text(50, 50, something); 
      }); 

     }); 
    </script> 
    <style type="text/css"> 
    #letters 
    { 
    text-align:center; 
    margin-left:10px; 
    width:25px; 
    float:left; 
    text-shadow:10px 5px 1px #4D4D4D; 
    filter:DropShadow(Color=#4D4D4D, OffX=10, OffY=5); 
    font-weight:bold; 
    } 

    </style> 

    </head> 

    <body> 
     Text: <input type="text" id="words" value="" /> 
     <input id="animate" type="button" value="Animate" /> 
     <div id='letters'></div> 
     <div id="draw-here-raphael" style="height: 200px; width: 400px; margin-top:0px; background-color:blue;"> 
     </div> 
     <div id="elps" style="margin-left:100px;"/> 
    </body> 
</html>

更新：

要删除以前的文字，它只是利用拉斐尔remove功能的问题。此外，我们必须重置变量something

if (alpha) alpha.remove();

http://jsfiddle.net/fN9Me/1/

来源

2012-07-23 15:00:51 r0m4n

哇。谢谢您的帮助。你认为你可以把所有的代码放到一个页面上吗？如果没有，没什么大不了的。 – 2012-07-23 15:04:05

这个解决方案的一个问题虽然......你如何使它如果我输入新的东西不打印我输入的内容？ – 2012-07-23 15:14:36

基本上我想清除一些东西，每次它被点击... – 2012-07-23 15:16:43

你实际上没有显示任何东西。这条线：

document.getElementById("letters").innerHTML + splittxt[i] + "<br>";

需要是这样的：

document.getElementById("letters").innerHTML += splittxt[i] + "<br>";

来源

2012-07-23 14:47:04

与mattbarkley在usc的qb有任何关系？ – 2012-07-23 15:33:53

的所述words输入的value是空白=>当调用拆分方法var splittxt = txt.split("");的splittxt具有length == 0，并且for的因此体语句从不执行。

来源

2012-07-23 15:02:33 mabbas

回答

相关问题