Javascript 将keyup事件从文本字段更改为下拉列表

在Rails中，我正在将文本字段上的keyup事件更改为引用下拉选择。下面是函数调用：

$(document).ready(function(){
    $('#survey_q1').keyup(calculate);
    $('#survey_q2').keyup(calculate);
    $('#survey_q3').keyup(calculate);
    $('#survey_q4').keyup(calculate);
    $('#survey_q5').keyup(calculate);
    $('#survey_q6').keyup(calculate);
});

function calculate(e)
{
    // Set each value as they come in
    var q1 = parseInt($('#survey_q1').val());
    var q2 = parseInt($('#survey_q2').val());
    var q3 = parseInt($('#survey_q3').val());
    var q4 = parseInt($('#survey_q4').val());
    var q5 = parseInt($('#survey_q5').val());
    var q6 = parseInt($('#survey_q6').val());
    // Don't do the calculation until all values are present
    if ( q1 > 0 && q2 > 0 && q3 > 0 && q4 > 0 && q5 > 0 && q6 > 0) {
        $('#survey_agent_score').val(
            parseFloat((((q2 + q3 + q4 + q5 + q6) + (1.5 * q1)) / 32.5) * 100).toFixed(2)
        );
    } else {
        $('#survey_agent_score').val('');
    }
}

以下是变化前的视图：

    <table>
        <h4>Survey</h4>
        <tr>
            <td style="vertical-align: top; text-align: right;"><label for="survey_q1">Question 1:</label></td>
            <td><input id="survey_q1" name="survey[q1]" style="width:60px;text-align:left;" type="text" class="required" value="<%= survey['q1'] %>" /></td>
        </tr>
        <tr>
            <td style="vertical-align: top; text-align: right;"><label for="survey_q2">Question 2:</label></td>
            <td><input id="survey_q2" name="survey[q2]" style="width:60px;text-align:left;" type="text" class="required" value="<%= survey['q2'] %>" /></td>
        </tr>
        <tr>
            <td style="vertical-align: top; text-align: right;"><label for="survey_q3">Question 3:</label></td>
            <td><input id="survey_q3" name="survey[q3]" style="width:60px;text-align:left;" type="text" class="required" value="<%= survey['q3'] %>" /></td>
        </tr>
        <tr>
            <td style="vertical-align: top; text-align: right;"><label for="survey_q4">Question 4:</label></td>
            <td><input id="survey_q4" name="survey[q4]" style="width:60px;text-align:left;" type="text" class="required" value="<%= survey['q4'] %>" /></td>
        </tr>
        <tr>
            <td style="vertical-align: top; text-align: right;"><label for="survey_q5">Question 5:</label></td>
            <td><input id="survey_q5" name="survey[q5]" style="width:60px;text-align:left;" type="text" class="required" value="<%= survey['q5'] %>" /></td>
        </tr>
        <tr>
            <td style="vertical-align: top; text-align: right;"><label for="survey_q6">Question 6:</label></td>
            <td><input id="survey_q6" name="survey[q6]" style="width:60px;text-align:left;" type="text" class="required" value="<%= survey['q6'] %>" /></td>
        </tr>
        <tr>
            <td style="vertical-align: top; text-align: right;"><label for="survey_agent_score">Agent Score:</label></td>
            <td><input id="survey_agent_score" name="survey[agent_score]" style="width:90px;text-align:left;background-color:#D6D6D6;" type="text" class="required" value="<%= survey['agent_score'] %>" readonly /></td>
        </tr>
    </table>

调查
问题1：
问题2：
问题3：
问题4：
问题5：
问题6：
代理分数：

以下是我要在视图中将文本字段更改为的代码段：

<td><%= select_tag "survey[q1]", options_for_select(Call::ANSWERS, @call.survey['q1']), promt: "Please select ..." %></td>

以下是添加Rails代码段时呈现的HTML：

<td style="vertical-align: top; text-align: right;"><label for="survey_q1">Question 1:</label></td>
<td>
    <select id="survey_q1" name="survey[q1]" promt="Please select ..."><option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
    </select>
</td>

问题1：
1.
2.
3.
4.
5.

当我在文本字段中输入一个数值时，它调用keyup事件进行计算。在填写所有六（6）个字段之前，计算文本字段将显示空白。我想将为数值输入的文本字段更改为数字下拉列表。我想保留的所有其他功能

---

就价值节约而言，没有问题。使用键盘上的向上/向下/回车键确实会触发该事件。它只是没有注册鼠标的选择。

下面是一个工作示例。我修改了你的代码以保持简单

HTML

<div id="survey">
  <select id="q1" name="q1" class="q">
    <option value="0">0</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
  </select>
  <select id="q2" name="q2" class="q">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
  </select>
  <input id='survey_agent_score' name='survey_agent_score' />
</div>

我找到了答案

只需将：onchange添加到“select_标记”即可

<td><%= select_tag "survey[q1]", options_for_select(Call::ANSWERS, @call.survey['q1']), :onchange => 'calculate(survey_q1)' %></td>

“计算（调查_q1）”%>

---

这使我可以随时进行计算，并可以下拉选择数字。

那么问题出在哪里？我想在保留计算功能的同时，将在文本字段中输入数值的功能更改为从数字列表中进行选择。我想让它在运行中进行计算。您是否尝试过对

选择
元素使用
change
事件而不是
keyup
事件？我尝试过了。它没有注册函数调用calculate（）。它唯一注册的时间是当我使用上/下箭头并输入（keyup事件）时。只需将：onchange=>“calculate（survey_q1）”添加到我的“select_tag”即可调用该函数。我会在我能够的时候添加答案。这不起作用，我想是因为我使用的是我的HTML，它没有正确呈现。再仔细看看。如果需要更多帮助，请发布呈现的html。使用呈现的html更新问题。我找到了答案。有：onchange=>'calculate（survey_q1）'添加到我的'select_tag'以调用函数。
<td><%= select_tag "survey[q1]", options_for_select(Call::ANSWERS, @call.survey['q1']), :onchange => 'calculate(survey_q1)' %></td>