Question

我写了自己的Jquery月份选择器控件。月份选择器位于<div />内，而<input />依次附加到我调用它的(function ($) { //dict has to be a serialized dictionary. The dictionary needs to have years (as numbers) as keys and for each year a list of numbers representing the months. //Only the provided years/month will be serialized as html. //Sample usage (Razor): //var json = @Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(Model.Periods.ToArray())); //$('#monthPicker').CondatoMonthPicker(json); $.fn.CustomMonthPicker = function (dict) { debugger; //Construct HTML var wrapper = $(this); $monthPickerHeaderHtml = $('some html...'); wrapper.append($monthPickerHeaderHtml); }; })(jQuery);字段。

澄清一下，这是代码：

@Html.TextBoxFor(model => model.TimePeriod, new { @id = "custom-datepicker", @type = "date", @class = "ms-TextField-field" })

从我的代码中注意到，我正在使用MVC Razor。因此，我使用它来实例化持有datepicker的字段：

<input autocomplete="off" class="ms-TextField-field" data-val="true" data-val-date="The field TimePeriod must be a date." data-val-required="The TimePeriod field is required." id="custom-datepicker" name="TimePeriod" type="date">

然而，这会生成以下html：

.append()

注意缺少的结束标记。回到我的自定义日期选择器函数，当我在我的包装器（<div />）对象上使用<input autocomplete="off" class="ms-TextField-field" data-val="true" data-val-date="The field TimePeriod must be a date." data-val-required="The TimePeriod field is required." id="custom-datepicker" name="TimePeriod" type="date"> My custom html goes here... </input>时，它会吐出以下输出html：

</input>

正如您所看到的，它不是附加我的自定义html，而是实际插入它并在其后面添加一个结束<input>标记，从而阻止我的整个构造显示在我的页面上。有谁知道为什么会这样，以及如何解决

编辑：我觉得我的措辞不够清楚。我不想设置

<input ...></input>
My custom html...

字段的值。不知何故，JQuery获取输入元素，INSERTS我的html并在最后添加结束标记时添加结束标记，然后在该结束标记之后附加我的自定义html，使其看起来像这样：

1,2,3,4...

Answer 1

通常输入没有结束标记，而是使用value属性。当你不是追加时会发生什么，改变输入的val（）。如果您需要，文本区域将更适合打开和关闭输入区域。

wrapper.val($monthPickerHeaderHtml);

这是我发现的相关文章：closing HTML input tag issue

Jquery append（）在没有关闭标记

1 个答案: