Javascript和HTML，Javascript函数没有输出

我对HTML和Javascript真的很陌生，所以请原谅我的任何明显的错误。Javascript和HTML，Javascript函数没有输出

我想获得一个Javascript函数来工作并返回一个HTML值。

该函数接受一个数字的输入并返回一个罗马数字。

发生的唯一情况是显示一个黑色的'>'字符，同时也忽略了我的<style>声明是＃839496。

我的代码：

<!doctype html> 
    <html> 
    <head> 
    <title>Numbers</title> 
    <style> 
    body {background-color:#002b36} 
     h1 {color:#fdf6e3} 
     h2 {color:#fdf6e3} {font-size: size 9} 
     h3 {color:#fdf6e3} {font-size: size 19} 
     p {color:#839496} 
    </style> 
    </head> 
    <body> 
    <h1>Numbers</h1> 
    <h2>An app to display detailed info about a number</h2> 
    <hr> 
    <br /> 

    <form id="form"> 
    <input id="num" type="number" min="1" name="num"> 
    <button onclick="document.getElementById("rom").innerHTML = result;">Get results</button> 
    </form> 

    <h3>Results</h3> 
    <hr> 
    <p id="rom"></p> 

    <script javascript type="text/javascript"> 
    document.getElementById("num").value = num; 
    num = parseInt(document.getElementById("num").value); 

    var result = '', 
     ref = ['M','CM','D','CD','C','XC','L','XL','X','IX','V','IV','I'], 
     xis = [1000,900,500,400,100,90,50,40,10,9,5,4,1]; 

    if (num <= 3999999 && num >= 4000) { 
     num += ''; // need to convert to string for .substring() 
     result = '<label style="text-decoration: overline;">'+convert(num.substring(0,num.length-3))+'</label>'; 
     num = num.substring(num.length-3); 
    } 

    for (x = 0; x < ref.length; x++){ 
     while(num >= xis[x]){ 
      result += ref[x]; 
      num -= xis[x]; 
     } 
    } 

document.getElementById("rom").innerHTML = (result); 

</script javascript type="text/javascript"> 


</script> 

    </body> 
</html>

来源

2015-10-06 Bharadwaj Raju

是什么'' –

还什么'H2 {颜色：＃fdf6e3} {font-size：size 9}' –

将** onclick **事件中的单引号替换为双引号convert this ** ** to ** ** – Mayank

-1

加载页面时，您只能读取文本框num的价值。因此，当用户进行更改时，您永远不会获得价值。你需要改变你的代码，使它存在于一个函数中。当你点击按钮时，它会调用运行带有更新值的代码的函数。

第二个问题是你在双引号内引用了双引号。所以内部关闭了外面。你需要在它们中使用单引号。更好的是不加引人注目地添加事件。

javascript在脚本标记没有意义，摆脱它。 <script type="text/javascript"> 另外</script javascript type="text/javascript">是错误的。摆脱类型，结束标记不应该有属性。你还有一个额外的</script>标签。

在定义之前，您使用num。

样式不会将所有内容分隔到自己的组中。并且没有设置字体的“大小”。它应该像

h2 { 
    color:#fdf6e3; 
    font-size:9px; 
}

<!doctype html> 
<html> 
    <head> 
    <title>Numbers</title> 
    <style> 
     body {background-color: #002b36; } 
     h1 { color:#fdf6e3; } 
     h2 { color:#fdf6e3; font-size: 9px; } 
     h3 { color:#fdf6e3; font-size: 9px; } 
     p { color:#839496; } 
    </style> 
    </head> 
    <body> 
    <h1>Numbers</h1> 
    <h2>An app to display detailed info about a number</h2> 
    <hr> 
    <br /> 

    <form id="form"> 
     <input id="num" type="number" min="1" name="num"> 
     <button onclick="calculate(); return false;">Get results</button> 
    </form> 

    <h3>Results</h3> 
    <hr> 
    <p id="rom"></p> 
    <script type="text/javascript"> 
     function calculate() { 
     num = parseInt(document.getElementById("num").value); 

     var result = '', 
      ref = ['M','CM','D','CD','C','XC','L','XL','X','IX','V','IV','I'], 
      xis = [1000,900,500,400,100,90,50,40,10,9,5,4,1]; 

     if (num <= 3999999 && num >= 4000) { 
      num += ''; // need to convert to string for .substring() 
      result = '<label style="text-decoration: overline;">'+convert(num.substring(0,num.length-3))+'</label>'; 
      num = num.substring(num.length-3); 
     } 

     for (x = 0; x < ref.length; x++){ 
      while(num >= xis[x]){ 
      result += ref[x]; 
      num -= xis[x]; 
      } 
     } 

     document.getElementById("rom").innerHTML = result; 
     } 
    </script> 

    </body> 
</html>

来源

2015-10-06 13:01:54 epascarello

谢谢！也帮助我避免将来出现这样的错误。 –

如何在其他功能中重复使用输入？ –

参考输入？我不确定你在问什么。 – epascarello

-2

试试这个

<!doctype html> 
     <html> 
     <head> 
     <title>Numbers</title> 
     <style> 
     body {background-color:#002b36} 
      h1 {color:#fdf6e3} 
      h2 {color:#fdf6e3;font-size:9px} 
      h3 {color:#fdf6e3;font-size:19px} 
      p {color:#839496} 
     </style> 
     </head> 
     <body> 
     <h1>Numbers</h1> 
     <h2>An app to display detailed info about a number</h2> 
     <hr> 
     <br /> 

     <form id="form"> 
     <input id="num" type="number" min="1" name="num"> 
     <button onclick="document.getElementById("rom").innerHTML = result;">Get results</button> 
     </form> 

     <h3>Results</h3> 
     <hr> 
     <p id="rom"></p> 

     <script> 
     document.getElementById("num").value = num; 
     num = parseInt(document.getElementById("num").value); 

     var result = '', 
      ref = ['M','CM','D','CD','C','XC','L','XL','X','IX','V','IV','I'], 
      xis = [1000,900,500,400,100,90,50,40,10,9,5,4,1]; 

     if (num <= 3999999 && num >= 4000) { 
      num += ''; // need to convert to string for .substring() 
      result = '<label style="text-decoration: overline;">'+convert(num.substring(0,num.length-3))+'</label>'; 
      num = num.substring(num.length-3); 
     } 

     for (x = 0; x < ref.length; x++){ 
      while(num >= xis[x]){ 
       result += ref[x]; 
       num -= xis[x]; 
      } 
     } 

     document.getElementById("rom").innerHTML = (result); 

     </script> 


    </body> 
</html>

来源

2015-10-06 13:03:26

Javascript和HTML，Javascript函数没有输出

回答

相关问题