0

我想在网站上使用新的 Jquery UI Spinner 小部件。我的问题是该网站已经使用 jquery UI 1.8.10,当我尝试更新到 1.9 时,由于其他插件依赖于 V 1.8,我遇到了很多错误。

是否可以在已经加载 jquery ui 1.8 的页面上加载微调器小部件?是否可以串联加载 jquery ui 1.9,以便我可以加载微调器小部件?是否可以修改微调器小部件以使用 1.8?任何帮助将不胜感激。

这是我想使用的微调器的快速小提琴(选择小时和分钟,步长半小时) - http://jsfiddle.net/fDpE9/5/

4

1 回答 1

0

我决定制作一个 JavaScript 函数来创建我自己的不带 jQuery UI 的小部件。我添加了一个创建函数来用与 Jquery UI 微调器相同的 HTML 替换输入,并将我自己的微调函数附加到按钮单击中。仍然需要在按钮上添加按住鼠标事件,但你明白了。

function createHourMinSpinner(elementSelector) {
    $(elementSelector).replaceWith('<span class="ui-spinner ui-state-default ui-widget ui-widget-content ui-corner-all"><input id="' + $(elementSelector).attr('id') + '" class="ui-spinner-input" value="' + $(elementSelector).val() + '" name="' + $(elementSelector).attr('name') + '" style="width:' + $(elementSelector).width() + 'px;" aria-valuenow="0" autocomplete="off" role="spinbutton"><a onclick="spinHourMin(\'#' + $(elementSelector).attr('id') + '\', true);" class="ui-spinner-button ui-spinner-up ui-corner-tr ui-button ui-widget ui-state-default ui-button-text-only" tabindex="-1" role="button" aria-disabled="false"><span class="ui-button-text"><span class="ui-icon ui-icon-triangle-1-n">▲&lt;/span></span></a><a onclick="spinHourMin(\'#' + $(elementSelector).attr('id') + '\', false);" class="ui-spinner-button ui-spinner-down ui-corner-br ui-button ui-widget ui-state-default ui-button-text-only" tabindex="-1" role="button" aria-disabled="false"><span class="ui-button-text"><span class="ui-icon ui-icon-triangle-1-s">▼&lt;/span></span></a>');
}

function spinHourMin(elementSelector, goingUp) {
    var originalVal = $(elementSelector).val() + "";
    var originalWhole = parseInt(originalVal.split(':')[0]);
    var originalFract = parseInt(originalVal.split(':')[1]);
    var newValue = "0:00";

    if (!goingUp && originalWhole == 0) {
        newValue = "0:00";
    } else if (goingUp && (originalFract == undefined || originalFract < 30 || isNaN(originalFract))) {
        newValue = originalWhole + ":30";
    } else if (goingUp && originalFract >= 30) {
        newValue = (originalWhole + 1) + ":00";
    } else if (!goingUp && (originalFract == undefined || originalFract == 0 || isNaN(originalFract))) {
        newValue = (originalWhole - 1) + ":30";
    } else if (!goingUp && originalFract > 30) {
        newValue = originalWhole + ":30";
    } else if (!goingUp && originalFract <= 30 && originalFract != 0 && originalFract != undefined) {
        newValue = originalWhole + ":00";
    }

    $(elementSelector).val(newValue);
}
于 2012-10-12T12:06:32.413 回答