onkeyup的Javascript问题

时间:2015-02-26 17:12:50

标签: javascript jquery html

我似乎遇到以下代码问题。我正在使用一个按钮来打印另一行输入字段。并且onkeyup无法正常工作,并且由于工作不正常,因此不会格式化文本。不确定我是否做错了什么。它适用于Chrome,但不适用于IE 11.

$(document).ready(function () {
    var work_count = 0;
    $("#addbutton").click(function () {
        //Html to create a new field
        var newField = "<tr class = 'project_type[" + work_count + "]'>\
        <td style='text-align: center;'> \
            <select name='f_types[]'><option value=''>-----Select----</option>\
            <option value=''></option>\
            <option value=''></option>\
            <option value=''></option>\
            <option value=''></option>\
            <option value=''></option>\
            </select>\
        </td>\
        <td style='text-align: center;'>\
            <input type='text' name='proj_no[]' size='8' maxlength='7' value='' class='test' onkeyup='if (this.value.length==3) {this.value=this.value+'/'}' onkeypress='if (event.keyCode==45) {return false} else {return true}' onblur='if (this.value.length==6) {this.value=this.value+'X'}'  placeholder='111-111' /> \
        </td>\
        <td style='text-align: center;'>\
            <input type='text' name='box_number[]' placeholder='Required' value='' maxlength='7' size='8' />\
        </td>\
        <td colspan='3' style='text-align: center;'>\
            <input type='text' name='comments[]' value='' placeholder='Comments Necessary for futrure reference' size='70' />\
        <input type='button' id='removeButton' class='flatBtn' value='X' /></td>\
    </tr>";
        $("#work").after(newField);
        work_count++;

        $("#removeButton").on('click', function (events) {
            $(this).parents('tr').remove();
        });
    });
    //end of document.ready
});

提前感谢您帮助我解决这个问题。

1 个答案:

答案 0 :(得分:2)

您在Javascript属性中使用与字符串文字相同类型的引号,因为您在属性周围。所以启动文字的引用就是结束属性。您需要在文字周围使用双引号来区分它们。由于双引号也围绕您分配给newField的字符串文字,因此您需要转义它们以防止结束该字符串。

您需要在onkeyuponblur中执行此操作。

<input type='text' name='proj_no[]' size='8' maxlength='7' value='' class='test' onkeyup='if (this.value.length==3) {this.value=this.value+\"/\"}' onkeypress='if (event.keyCode==45) {return false} else {return true}' onblur='if (this.value.length==6) {this.value=this.value+\"X\"}'  placeholder='111-111' /> \

如果使用Javascript / jQuery而不是内联属性绑定事件处理程序,则可以避免这种复杂性。由于这些是动态添加的元素,因此您可以按照Event binding on dynamically created elements?

中的说明使用事件委派