Question

我需要一些帮助来建议正确的方法来做到这一点。基本上，我在数据库中有一个名为＆＃34; SupportRenewMonth＆＃34;它会存储月数。

在提交表单上，我有一个下拉列表选项，分别为12个月，36个月或其他（见下面的代码）。当用户点击＆＃34;其他＆＃34;时，我会尝试取消隐藏输入框，用户需要手动输入月份数量（尚未弄清楚如何隐藏/取消隐藏文本框，但我会）

<select name="SupportRenewMonth" id="SupportRenewMonth">
    <option value="12">12 Month</option>
    <option value="36">36 Month</option>
    <option value="Other">Other</option>
</select>
Enter Month Number:
<input type="text" name="SupportRenewMonthManual" id="SupportRenewMonthManual">

问题是我需要捕获选择框＆＃34; SupportRenewMonth＆＃34;或文本框＆＃34; SupportRenewMonthManual＆＃34;。有没有办法告诉表单从SupportRenewMonthManual转移到值到SupportRenewMonth选择框，然后提交表单。这样我就不必修改我的ASP代码来尝试捕获它们，然后整理出要存储在数据库中的值。

Answer 1

我认为这应该有效。确保以下代码处于文档准备或窗口加载

$("form").submit(function(){
    var v = $('#SupportRenewMonth').val();
    if( v!== 'Other') {
        $('#SupportRenewMonthManual').val( v );
    }
});

对于输入框hide / show

$('#SupportRenewMonth').on('change', function() {
    if($(this).val() == 'Other') {
        $('#SupportRenewMonthManual').show();
    } else {
        $('#SupportRenewMonthManual').hide();
    }
}).change();

http://jsfiddle.net/pCDm6/

正如您注意到文本仍在显示，您可以将整个块包装起来，然后显示/隐藏块以使其更好但我会将该部分留给您。你应该能够很容易地弄明白

Answer 2

我相信这样的事情应该适用于更新你的值和隐藏字段框。

<强> HTML

<select name="SupportRenewMonth" id="SupportRenewMonth">
    <option value="12">12 Month</option>
    <option value="36">36 Month</option>
    <option value="Other">Other</option>
</select>
<label labelfor="SupportRenewMonthManual" id="SupportRenewMonthManualLabel">Enter Month Number: </label>
<input type="text" name="SupportRenewMonthManual" id="SupportRenewMonthManual">

<强> JS

$(document).ready(function() {
    $('#SupportRenewMonthManualLabel').hide();
    $('#SupportRenewMonthManual').hide();
    $('#SupportRenewMonthManual').val($('#SupportRenewMonth').val());
    $('#SupportRenewMonth').change(function() {
        var selectedItem = $("select option:selected").val();
        if (selectedItem !== 'Other') {
            $('#SupportRenewMonthManualLabel').hide();
            $('#SupportRenewMonthManual').hide();
            $('#SupportRenewMonthManual').val($('#SupportRenewMonth').val());
        }
        else
        {
            $('#SupportRenewMonthManualLabel').show();
            $('#SupportRenewMonthManual').val('');
            $('#SupportRenewMonthManual').show();
        }
    });
});

与往常一样，请务必对您认为有用的任何StackOverflow答案进行投票。

Answer 3

只需从输入中删除name，因此无法将其提交给服务器，并处理jQuery中的更改以将正确的值设置为下拉列表。

例如。

<select name="SupportRenewMonth" id="SupportRenewMonth">
    <option value="12">12 Month</option>
    <option value="36">36 Month</option>
    <option value="Other">Other</option>
</select>Enter Month Number:
<input type="text" id="SupportRenewMonthManual">

<强> JS

$('#SupportRenewMonthManual').on('keyup', function (e) {
    var month = $(this).val();
    $('#SupportRenewMonth option[value="' + month + '"]').prop('selected', true);
});

DEMO

将输入值传输到选择下拉列表

3 个答案: