选择输入/字符串的一部分而不是全部

时间:2012-03-28 01:34:29

标签: javascript jquery

我有一个包含日期值的输入

03/15/2012

我试图只选择值的一部分而不是整个事物。例如,如果我点击2012年2之前的地点,2012年将被选中而不是整个日期(月和日都是如此)。

这是我正在使用的代码

HTML:

<input class = "date-container" />

的javascript / jquery的:

$('.date-container').on('select', function (e)
    e.preventDefault()
    this.onselectstart = function () { return false; }; 
})

$('.date-container').on('focus', function ()
{
    if (document.selection) {
        this.focus();
        var Sel = document.selection.createRange();
        Sel.moveStart('character', -this.value.length);
        CaretPos = Sel.text.length;
    }

    // Firefox support

    else if (this.selectionStart || this.selectionStart == '0')
        switch (this.selectionStart) {
        case 0:
        case 1:
           this.selectionStart = 0;
           this.selectionEnd = 1;
           break;
     }

}

到目前为止,我已尝试了几件事。上面的代码试图阻止正常的选择操作,然后根据焦点的位置,选择字符串的一部分(我只有月份部分的switch语句选项,但如果它工作,我会做同样的白天和年)。这可能是错误的做法。

注意事项:

选择我的意思是高亮。

我不想使用插件。

1 个答案:

答案 0 :(得分:1)

此代码将选择点击日期的部分:

$(".date-container").click(function() {
    var val = $(this).val();
    var sel = this.selectionStart;
    var firstSep = val.indexOf("/"), secondSep;
    if (firstSep != -1) {
        secondSep = val.indexOf("/", firstSep + 1);
        if (secondSep != -1) {
            if (sel < firstSep) {
                this.setSelectionRange(0, firstSep);
            } else if (sel < secondSep) {
                this.setSelectionRange(firstSep + 1, secondSep);
            } else {
                this.setSelectionRange(secondSep + 1, val.length);
            }
        }
    }
});​

您可以在此处查看:http://jsfiddle.net/jfriend00/QV4VT/