引用php中id元素的Javascript
Javascript referencing to id element in php
我有一个用php显示用户数据的表单。然后我有一个输入字段,其中应该输入数量。然后执行的JS计算总数并更新总输入元素。
问题在于对输入的相关id元素的引用。我的JS只是引用php数组中的最后一个元素。例如id名称为id="qty" . $userid
,例如id名称将为qtyuser001、qtyuser002、qtyuser 003等,但JS仅指qtyuser003。
我已经为此挣扎了一天多,尝试了不同的方法,但我无法让它发挥作用。有没有其他方法可以解决这个问题?
php代码
$get2 = mysqli_query($con,"SELECT * FROM table WHERE ...");
echo '<form method="post" action="">';
while($row2 = mysqli_fetch_array($get2)) {
$userID = $row2['userID'];
$fn = $row2['FirstName'];
$ln = $row2['LastName'];
echo '<tr>';
echo '<td><input readonly name="userID[]" id="userID ' . $userID . '" value="' . $userID . '"></td>';
echo '<td>' . $fn . ' ' . $ln . '</td>';
echo '<td><input type="text" size="5" name="nrOfQ[]" id="nrOfQ' . $userID . '" onchange="calc()"></td>';
echo '<td><input readonly type="text" size="5" name="total" id="total' . $userID . '"></td>';
echo '</tr>';
}
echo '</table>';
JS代码
<script>
function calc() {
var userid = <?php echo json_encode($userID); ?>;
var myrate = <?php echo json_encode($FieldInterviewerRate); ?>;
var myqty = document.getElementById('nrOfQ' + userid).value;
myResult = myqty * myrate;
var elem = document.getElementById('total' + userid);
elem.value = myResult;
}
</script>
我现在没有那么好的Javascript
您的问题是,您每次都没有初始化JS函数,而且不应该初始化。JS代码不应该依赖于PHP,而是动态的。请尝试这个
php
$get2 = mysqli_query($con,"SELECT * FROM table WHERE ...");
echo '<form method="post" action="">';
while($row2 = mysqli_fetch_array($get2)) {
$userID = $row2['userID'];
$fn = $row2['FirstName'];
$ln = $row2['LastName'];
echo '<tr>';
echo '<td><input readonly name="userID[]" id="userID ' . $userID . '" value="' . $userID . '">
<input type="hidden" id="myRate' . $userID . '"></td>';
echo '<td>' . $fn . ' ' . $ln . '</td>';
echo '<td><input type="text" size="5" name="nrOfQ[]" id="nrOfQ' . $userID . '" onchange="calc(this)"></td>';
echo '<td><input readonly type="text" size="5" name="total" id="total' . $userID . '"></td>';
echo '</tr>';
}
echo '</table>';
<script>
function calc(obj) {
var id = obj.id;
var userId = id.substr(5);
var myrate = document.getElementById('myRate' + userId).value;
var myqty = document.getElementById('nrOfQ' + userId).value;
myResult = myqty * myrate;
var elem = document.getElementById('total' + userId);
elem.value = myResult;
}
</script>
相关文章:
- 如何找到Javascript元素的最长边
- 如何通过它瞄准javascript元素's的onclick属性
- Javascript元素相对于屏幕的位置
- 找不到javascript元素
- JavaScript元素遍历返回的值超出预期
- 没有获得基础's的Javascript元素工作(与Laravel和Elixir)
- 为什么在ASP.NET Ajax更新面板中执行任何操作后javascript元素都停止工作
- 将 JavaScript 元素 ID 传递给 PHP 或 Form Variable
- Javascript元素相互阻塞
- CefSharp javascript元素点击不;不起作用,但手动点击它可以
- javascript元素.click()发布Safari
- Javascript元素更新侦听器
- Javascript 元素值的总和
- 在 php 代码中调用 javascript 元素
- If-Statement中的Javascript元素验证
- JavaScript 元素识别和检索
- 单击内部锚点/哈希时自动更新 JavaScript 元素
- 将 JavaScript 元素作为变量传递
- 按下表单重置按钮时删除 JavaScript 元素
- 将 javascript 保留在新的 JavaScript 元素中