文本框中的onchange事件无法正常工作

时间:2014-03-18 15:13:16

标签: javascript jquery html

我可以帮助我在文本框中搜索后如何在输入工作中制作一个onchange事件。

我的问题是:它无法正常工作我尝试了keydownblur和jquery,但它仍然没有对我有用我需要你的帮助。

html代码:

<input onkeydown="updateTextboxes()" class="search_textbox" autocomplete="off" type="text" name="search" id="query" />

我尝试使用jquery $('#query').change(updateTextboxes);,但它不起作用:(

脚本代码:

<script>
$(document).ready(function() {

    var $funiq_id = $('#funiq_id'),
        $t_region = $('#t_region'),
        $t_town = $('#t_town'),
        $t_uniq_id = $('#t_uniq_id'),
        $t_position = $('#t_position'),
        $t_salary_grade = $('#t_salary_grade'),
        $t_salary = $('#t_salary');

    function updateTextboxes() {
        $.ajax({
            url: "search.php",
            type: "GET",
            data: {term: $('#query').val()},
            dataType: "JSON",
            success: function(result) {
                var ii = 1;
                for (var i = 0; i < result.length; i++) {
                    $funiq_id.html(result[i].value).show();
                    $t_region.val(result[i].region).show().trigger('input');
                    $t_town.val(result[i].town).show().trigger('input');
                    $t_uniq_id.val(result[i].uniq_id).show().trigger('input');
                    $t_position.val(result[i].position).show().trigger('input');
                    $t_salary_grade.val(result[i].salary_grade).show().trigger('input');
                    $t_salary.val(result[i].salary).show().trigger('input');
                    $('#id' + ii + '').val(result[i].atid).show().trigger('input');
                    $('#aic' + ii + '').val(result[i].atic).show().trigger('input');
                    $('#name' + ii + '').val(result[i].atname).show().trigger('input');
                    $('#other_qual' + ii + '').val(result[i].other_sum).show().trigger('input');
                    $('#interview' + ii + '').val(result[i].interview_sum).show().trigger('input');
                    $('#optA' + ii + '').val(result[i].edu_attain2_sum).show().trigger('input');
                    $('#optB' + ii + '').val(result[i].experience2_sum).show().trigger('input');
                    $('#optC' + ii + '').val(result[i].trainings2_sum).show().trigger('input');
                    $('#optD' + ii + '').val(result[i].eligibility2_sum).show().trigger('input');
                    $('#total' + ii + '').val(result[i].final_total_sum).show().trigger('input');
                    $(':input').removeAttr('placeholder');
                    ii++;
                }
            }
        });
    };
    $('.search_form_input').val('');
    $('.search_textbox').val('');
    $(".empty_batchcode").html("");
    $('#execute').prop('disabled', true);
});      
</script>

3 个答案:

答案 0 :(得分:1)

$(document).ready(function() {试试这个:

var updateTextboxes = function () {[...]}
$('#query').change(updateTextboxes);

您的代码:

<input onkeydown="updateTextboxes()" class="search_textbox" autocomplete="off" type="text" name="search" id="query" />

不起作用,因为函数updateTextboxes不在主范围内

答案 1 :(得分:1)

您收到updateTextboxes()未定义错误。从您的html代码中删除onkeydown="updateTextboxes()"并将其添加到您的jquery函数:

$('.search_textbox').on('keydown', function(){

      updateTextboxes()  
})

这里是小提琴:http://jsfiddle.net/Su9Uv/

答案 2 :(得分:1)

$('#query').on('change', updateTextboxes);


$('#query').on('input', updateTextboxes);
  • 倾听&#34;输入&#34;每次输入被修改时都会触发事件(即使是粘贴)。

    注意:&#34;输入&#34;只有在遗留浏览器支持不成问题时才应使用该事件。