2013-03-18 44 views
0

我对编程非常陌生,并且有一些问题。 我想创建一个表单(在html和javascript中),我可以在这里做一些计算。这是关于数字和年份。所以起初我需要把输入字段,我可以键入年份(如2013)。这个输入值将被连接到几个函数:javascript一个输入字段连接到几个函数

  1. 计算与当年的差异(如果我要求2018年它应该写5,或者如果我要求2000年,我会写-13等......)
  2. 检查,如果今年是闰年(真/假或是/否,...)
  3. 计算我问数的总和(2018 = 11,2013 = 6,...)
  4. 如果数字是素数(真/假,是/否,...)
  5. 反向数字(2013 = 3102,2018 = 8102,...)
  6. 显示今年中国十二生肖
  7. 转换年罗马数字(1 = I,2 = II,10 = X,...)

我也找到了一些功能,可我就是”把它放在一起,这将工作。 如果有人可以帮忙,我会非常有帮助。

的例子,我发现互联网上:

function isleap() { 
    var yr = document.getElementById("year").value; 
    if ((parseInt(yr) % 4) == 0) { 
     if (parseInt(yr) % 100 == 0) { 
      if (parseInt(yr) % 400 != 0) { 
       alert("Not Leap"); 
       return "false"; 
      } 
      if (parseInt(yr) % 400 == 0) { 
       alert("Leap"); 
       return "true"; 
      } 
     } 
     if (parseInt(yr) % 100 != 0) { 
      alert("Leap"); 
      return "true"; 
     } 
    } 
    if ((parseInt(yr) % 4) != 0) { 
     alert("Not Leap"); 
     return "false"; 
    } 
} 

反向:

<script type="text/javascript"> 
    var year, b = 0; 
    year= parseInt(prompt("Enter year: ")); 

    document.write("You've entered: " + year+ "<br />"); 
    while(year> 0) {   
     b = b * 10 
     b = b + parseInt(year% 10) 
     year= parseInt(year/ 10) 
    } 
    document.write("Reverse numbers: ", b); 

</script> 

总和号:

<script> 
function find() { 
    var sum = 0; 
    var no = parseInt(frm.txt1.value); 
    while (no > 0) { 
     sum = sum + no % 10; 
     no = Math.floor(no/10); 
    } 
    alert("Sum of digits " + sum); 
} 
</script> 

<form name="frm"> 
    Enter a Number:<input name="txt1" type="text" /> 
    <input name="b1" onClick="find();" type="button" value="display" /> 
</form> 

回答

1

我会定义独立于输入参数形式的函数。然后,只需将该参数传递给每个函数并根据需要显示结果。

<script type="text/javascript"> 
function isLeap(yr) { 
    if ((parseInt(yr) % 4) == 0) { 
     if (parseInt(yr) % 100 == 0) { 
      if (parseInt(yr) % 400 != 0) { 
       return "false"; 
      } 
      if (parseInt(yr) % 400 == 0) { 
       return "true"; 
      } 
     } 
     if (parseInt(yr) % 100 != 0) { 
      return "true"; 
     } 
    } 
    if ((parseInt(yr) % 4) != 0) { 
     return "false"; 
    } 
} 

function reverse(year) { 
    var b = 0; 
    year = parseInt(year); 
    while (year > 0) { 
     b = b * 10 
     b = b + parseInt(year % 10) 
     year = parseInt(year/10) 
    } 
    return b; 
} 

function sum(no) { 
    var sum = 0; 
    while (no > 0) { 
     sum = sum + no % 10; 
     no = Math.floor(no/10); 
    } 
    return sum; 
} 

function outputData() { 
    var year = form.year.value; 
    alert("Is leap: " + isLeap(year)); 
    alert("Reversed: " + reverse(year)); 
    alert("Sum: " + sum(year)); 
} 
</script> 

<form name="form"> 
    Enter a Number:<input name="year" type="text" /> 
    <input name="b1" onClick="outputData();" type="button" value="display" /> 
</form> 
1
<input name="b1" onClick="function1(),function2()" type="button" value="display" /> 

    you can call like this 

    or 
    <input name="b1" onClick="callAllFunctions();" type="button" value="display" /> 

function callAllFunctions(){ 
    function1(); 
    function2(); 
} 
+0

@Like迈克是解决你的问题 – PSR 2013-03-18 13:33:40

+0

这看上去很好。现在就试试吧。非常感谢。如果我需要它,也许我会要求另一个帮助:) – Phantom 2013-03-18 20:40:10

1

您可以只创建一个函数来调用每个其他功能,然后设置为表单的onclick函数。

function processData(){ 
    function1(); 
    function2(); 
    function3(); 

} 

<input name="b1" onClick="processData();" type="button" value="display" /> 

分离该不同的功能与像PSR逗号提示也适用要求,但我认为这个结果是更好,因为它使标记比较干净,并允许您更改脚本逻辑需要,而不必直接编辑标记或根据需要继续添加功能。如果需要,您也可以直接将一个功能的结果传递给另一个功能。

2

它被认为是最佳实践separate concerns,我使用jQuery作为我DOM抽象库 - 它真的很容易。

有了这样的输入:

<input id="b1" name="b1" type="button" value="display" />

您可以使用jQuery on method这样的:

$('#b1').on('click', function (event) { alert('I was clicked'); });

$('#b1').on('click', function (event) { alert('I heard that click too'); });

你可以调用任何功能:

$('#b1').on('click', isLeap);

只是不要忘了,包括在这个片段在页面上的jQuery:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

1

这样的事情。这是唯一的例子...

<input type="text" name="year" id="year" value="" /> 
<input type="button" name="process" value="processYear" id="proc" onclick="process()"/> 


<script> 
function isLeap(val) 
{ 
    if (val % 4 ==0 && ((val % 100 ==0 && val % 400 ==0) || (val % 100 !=0))) 
    { 
     console.log("Leap..."); 
     return true; 
    } 
    else 
    { 
     console.log("Not Leep..."); 
     return false; 
    } 
} 

function _revers(val) 
{ 
    _val = val+""; 
    return _val.split("").reverse().join(""); 
} 

function sum(val) 
{ 
    _val = val+""; 
    return _val.split("").reduce(function(previousValue, currentValue){ 
       return currentValue + parseInt(previousValue); 
      }) 
} 

function diff(val) 
{ 
    return (new Date()).getFullYear() - val; 
} 

function process() 
{ 
    val = parseInt(document.getElementById("year").value)|0; 
    isLeap(val); 
    console.log('reverse:', _revers(val)); 
    console.log('sum:', sum(val)); 
    console.log('diff:', diff(val)); 
} 

相关问题