Question

我正在将评分系统添加到现有的JavaScript弹出窗口中，但是我无法获取被单击到隐藏字段以提交给表单的星形的值。

我的代码如下：

echo 'Please rate the quality of this transcript:<br/>';
echo '<div id="stars">';
for ($i = 1; $i <= 5; $i++) {
     echo '<img alt="' . $i . '" src="' . site_url('img/off.png') . '" id="' . $i . '" onclick="submitRating(' . $i . ');">';
}
echo '</div>';
echo '<input type="hidden" id="rating" name="rating" value="">';

被称为onclick的JavaScript是：

function submitRating(id) {
   for (i = 1; i <= id; i++) {
       document.getElementById(i).src = '<?php echo site_url('img/on.png'); ?>';
   }
   document.getElementById('submit').style.display = 'block';
   document.getElementById('rating').value = id.toInt();
}

当我回显已发送给函数以处理表单的内容时，它将等级显示为空白。我尝试使用document.getElementById('rating').value = new Number(id);和document.getElementById('rating').value = 'id';和document.getElementById('rating').value = id;，但这都不起作用。

如果我添加alert(id);，则会回显正确的值。

这是因为字段被隐藏了吗？我尝试将其设置为文本字段并隐藏它，但是那也不起作用。

编辑：我是在正确执行此操作还是需要使用jQuery或AJAX或类似内容？

Answer 1

您不能将数字用作DOM元素的标识符。

// Not possible
<div id="123"></div>

// Possible
<div id="element_123"></div>

规格：https://www.w3.org/TR/html401/types.html#type-name

Answer 2

我认为问题与隐藏字段集的值之前的行有关，请注释这些行，或者将设置隐藏字段行置于SubmitRating函数的顶部并测试代码

 function submitRating(id) {
   document.getElementById('rating').value = id;
   alert(document.getElementById('rating').value);
   //for (i = 1; i <= id; i++) {
       //document.getElementById(i).src = '<?php echo site_url('img/on.png'); //?>';
   //}
   //document.getElementById('submit').style.display = 'block';

 }

Answer 3

摆弄代码之后，我将response.data行移到了表单上方，并且可以正常工作。

未使用JavaScript设置隐藏字段的值

3 个答案: