Question

我在使用jQuery UI的组合框时遇到了一些麻烦。我正在尝试将源选择的占位符添加到ui的输入中，因此我可以轻松地在我的元素上设置所有内容并让小部件只需要了解所需的内容。但是，它似乎不希望占位符被任何空格/符号分隔，只应用第一个单词。

我试过了：

input = $("<input data-validation='required' placeholder=" + select.attr('placeholder') + ">")

用hifen和下划线替换空格（在这种情况下示例占位符=“开始输入”或“Start_typing”）：

input = $("<input data-validation='required' placeholder=" + select.attr('placeholder') + ">").replace(/-/g, ' ')

我也尝试将文本应用于title属性并以相同的方式获取，但结果相同。

我终于尝试了以下操作：

placeholder = select.attr('placeholder').replace(/-/g, ' ');
console.log(placeholder);
input = $("<input data-validation='required' placeholder="+placeholder+">")...

我可以看到占位符的值在应用于输入之前是正确的，所以我不知道从哪里开始。有什么想法吗？

JSFIDDLE包含整个小部件配置以及我正在测试的一些验证。

Answer 1

您需要在HTML字符串中添加引号：

input = $('<input data-validation="required" placeholder="' + select.attr('placeholder') + '">');

否则，它会将单词2到n视为附加属性。

Answer 2

您还可以通过添加设置为选择控件的处理属性来更改组合框的.js文件。例如，您经常选择：

<select id="YourId" placeholder="Some Text">...</select>

比：

  $(function () {
        $("#YourId").combobox();
        $("#toggle").click(function () {
            $("#YourId").toggle();
        });
    });

通过添加行

编辑组合框脚本

this.input.attr("placeholder", this.element.attr('placeholder'));

像这样：

(function ($) {         
$.widget("custom.combobox", {
            _create: function () {
                this.wrapper = $("<span>")
                  .addClass("custom-combobox")
                  .insertAfter(this.element);

                this.element.hide();
                this._createAutocomplete();
                this._createShowAllButton();

                // Add processing placeholder option
                this.input.attr("placeholder", this.element.attr('placeholder'));            
            },
    ..... 
    });})(jQuery);

通过这种方式，您还可以添加任何其他选项作为＆＃34; readonly＆＃34;等

jQuery UI将占位符添加到组合框中

2 个答案: