Jquery Steps会阻止datepicker工作吗?

时间:2017-06-27 20:36:09

标签: javascript jquery datepicker jquery-steps

我正在使用jquery步骤进行向导。但内部如果我使用datepicker或qtip功能无法正常工作。我切换.js参考仍然是同样的问题。

为什么datepicker事件无法在步骤中运行?控制台没有抛出任何错误。

   @Html.TextBoxFor(model => model.BirthDate, null, new {@class = "SPE-Formcontrol section_detail-font-14 calendar", @style = "display: inline", @readonly = "readonly", Name = "BirthDate", id = "BirthDate"})

 <script src="~/Scripts/join.js"></script>
    <script src="~/Scripts/jquery.steps.js"></script>

join.js

 $("#BirthDate").datepicker({
    changeMonth: true,
    changeYear: true,
    yearRange: '-110:-17',
    showOn: "button",
    buttonImage:"image",
    buttonImageOnly: true,
    beforeShow: function () {
        $('#ui-datepicker-div').css('z-index', 9999);
    },
    dateFormat: 'mm/dd/yy',
    maxDate: '-17Y'
});

$('.tip').qtip({
    style: {
        classes: 'myTipClass tipShadow qtip-rounded'
    }
});

2 个答案:

答案 0 :(得分:1)

同样的问题 它在向导之外工作正常,但是一旦在内部设置了输入,日期选择器的父 div 就会出现在 DOM 中,但它是空的... 不会出现日期选择器

试图声明

$(".datepicker").datepicker();

在 steps() 函数之前或之后,没有任何变化。

我尝试使用steps()函数的onInit()功能,还是不行

form.steps({
...
onInit : function (event, currentIndex) { $(".datepicker").datepicker(); },
...
});

答案 1 :(得分:0)

您需要先初始化jquery步骤,然后再初始化其他插件

$(function () {
//intilize steps first
 $("#wizard").steps({
    bodyTag: "fieldset",
    headerTag: "h4"
  });
//intilize other plugins later
 $("#BirthDate").datepicker();
});

希望这能解决您的问题