Question

下面的jquery代码用于文本输入框，以帮助用户以格式化方式输入时间。

我在这里测试了它

我现在想把它包含在我的html表单中，但我不知道它会去哪里？

它应该进入onchange标签吗？

input.click(function() {

        $(this).prop({
            selectionStart: 0, //moves cursor to poition zero in input box
            selectionEnd: 0
        });

    }).keydown(function() {

        var sel = $(this).prop('selectionStart'),
            val = $(this).val(),
            newsel = sel === 2 ? 3: sel;
            newsel = sel === 5 ? 6: newsel;

        $(this).val(val.substring(0, newsel) + val.substring(newsel + 1))

        .prop({
            selectionStart: newsel,
            selectionEnd: newsel
        });
    });

由于

Answer 1

将代码嵌入script代码中，并将第一行更改为：

$(function(){
    $('#inputId').click(...
});

Answer 2

将它放在文档加载函数中，如下所示：

$(document).load(function(){      
    var input = $("<input>", { //this bit will be removed in the form        
        name: 'time',        
        val: '00:00:00',        
        maxlength: '8',        
        size: '5'    
    });    
    input.click(function() {        
        $(this).prop({            
            selectionStart: 0,            
            selectionEnd: 0        
        });    
    }).keydown(function() {        
        var sel = $(this).prop('selectionStart'),            
        val = $(this).val(),            
        newsel = sel === 2 ? 3: sel;            
        newsel = sel === 5 ? 6: newsel;        
        $(this).val(val.substring(0, newsel) + val.substring(newsel + 1)).prop({            
            selectionStart: newsel,            
            selectionEnd: newsel        
        });    
    });    
    $('body').append(input);  
});

Answer 3

为了让球滚动你可以简单地将javascript放在你的表单下面的同一页面上。您最终希望将所有javascript放在外部.js文件中并通过<script src="my_javascript_file.js"></script>

包含它们

我在下面添加了您的脚本。你会注意到it's wrapped in CDATA tags - 这是一个处理XHTML文档类型的故障保护，这样XML解析器就会完全忽略脚本，并且在遇到不熟悉的字符时不会失败：

<form id="form" method="post" action="whatever.html">
    <!-- additional fields, submit button, etc -->
</form>
<script type="text/javascript">
/* <![CDATA[ */
    var input = $("<input>", { //this bit will be removed in the form
        name: 'time',
        val: '00:00:00',
        maxlength: '8',
        size: '5'
    });

    input.click(function() {

        $(this).prop({
            selectionStart: 0,
            selectionEnd: 0
        });

    }).keydown(function() {

        var sel = $(this).prop('selectionStart'),
            val = $(this).val(),
            newsel = sel === 2 ? 3: sel;
            newsel = sel === 5 ? 6: newsel;

        $(this).val(val.substring(0, newsel) + val.substring(newsel + 1))

        .prop({
            selectionStart: newsel,
            selectionEnd: newsel
        });
    });

    $(function(){
        $('#form').append(input);
    });

/* ]]> */
</script>

我在哪里将这个jQuery代码添加到我的页面中以获取表单？

3 个答案: