javascript - 如何对多个表单元素使用一个单独的 js 函数

标签 javascript php jquery html laravel

此处将根据用户输入的表单数量在单个 HTML 文件中创建。这里

function jsfunction() {  
  var number1 = document.getElementById("number").value; 
  var number = parseInt(number1); 
  number += number;
  document.getElementById("result").value = number; 
}
<body>

<?php 
  // this value is dynamically generated by refering database. Each time it varies.
  $count=2; 
?>

<input type="text" value="<?php echo $count; ?>" id="countt">

<?php
  for($i=0; $i<$count ; $i++ ) { 
?>

<form>  
  Enter No: <input type="text" id="number" name="number" onblur="jsfunction()"/><br/>  
  Value: <input type="text" id="result"/> 
</form>

<?php
  }
?>  

</body>

在每种形式中,我都对一个元素使用 onclick="jsfunction()"。 问题是这个 jsfunction 只适用于第一种形式。我需要对所有表单元素分别执行相同的 jsfunction

由于实际代码非常庞大,我将分享相同的小场景。请查看代码并帮助我。

谢谢。

最佳答案

您可以像这样动态地为您的表单分配唯一的 ID。然后将具有唯一 ID 号的参数传递给 JS 函数将有助于选择表单。

function jsfunction(id) {  
  var number1 = document.getElementById("number_" + id).value; 
  var number = parseInt(number1); 
  number += number;
  document.getElementById("result_" + id").value = number; 
}
<body>

<?php 
  // this value is dynamically generated by refering database. Each time it varies.
  $count=2; 
?>

<input type="text" value="<?php echo $count; ?>" id="countt">

<?php
  for( $i = 0; $i < $count; $i++ ) { 
?>

<form>  
  Enter No: <input type="text" id="number_<?php echo $i; ?>" name="number" onblur="jsfunction(<?php echo $i; ?>)"/><br/>  
  Value: <input type="text" id="result_<?php echo $i; ?>"/> 
</form>

<?php
  }
?>  

</body>

关于javascript - 如何对多个表单元素使用一个单独的 js 函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47432969/

相关文章:

javascript - 在我按下按钮确认之前单击事件触发

php - 在不违反唯一约束的情况下交换 MySQL 中两行的值?

javascript - Google 饼图 + PHP + mySQL

javascript - Select2.js 错误 : Cannot read property 'length' of undefined

javascript - 使用 JQuery 将 JSON 项目添加到 HTML 列表

javascript - Kendo UI Scheduler 禁用、删除、确认或更改其内容

javascript - sapui5 fiori xml View 如何添加BulletChart

javascript - jQuery 会正确转义我的引号吗?

php - 如何在不使用数组反转方法的情况下反转 php 中的数组

javascript - IE 和 FF 中的编码问题。在 Safari 和 Chrome 中工作