jquery-ui 相关问题

jQuery UI是一组精心设计的用户界面交互，效果，小部件和构建在jQuery JavaScript库之上的主题。

在 Jquery Ui Datepicker 中禁用今天之后的未来日期

我想在 Jquery Ui Datepicker 中禁用今天之后的所有未来日期这是演示：代码： $( "#start_date" ).datepicker( { 最大日期: '0', 演出前：

javascript jquery jquery-ui datepicker

回答 9 投票 0

手风琴和选项卡之间的区别

手风琴相对于选项卡有什么好处，反之亦然？尽管许多 Javascript UI 框架/库都支持它们，您可以在这里查看示例：http://jqueryui.com/demos/ 对于我...

javascript html jquery-ui user-interface

回答 4 投票 0

将值设置为 jquery 自动完成组合框

我正在使用 jquery 自动完成组合框一切都很好。但我也想通过 JavaScript 设置特定值，例如 $("#value").val("somevalue") 并将其设置为选择元素，但没有更改...

javascript jquery jquery-ui jquery-ui-autocomplete

回答 6 投票 0

禁用按钮上的 Jquery UI 工具提示

我正在尝试显示禁用按钮的工具提示。我不确定 jquery 事件是否会针对禁用元素触发，但我正在尝试检查是否可以显示禁用项目的工具提示。我的例子在这里 ...

jquery jquery-ui tooltip jquery-ui-tooltip

回答 5 投票 0

在将jquery-ui 1.12.1更新到1.13.2之前，我还需要更新jquery版本吗

我在我的项目中使用jquery-ui-1.12.1.min.js。我尝试将 jquery-ui 版本从 1.12.1 更新到 1.13.2。更新版本后，应用程序无法按预期运行（控制台错误...

html jquery jquery-ui

回答 1 投票 0

为什么 array.concat(…) 不修改数组？

所以我创建了这个 jqueryui 小部件。它创建了一个 div，我可以将错误传输到其中。小部件代码如下所示： $.widget('ui.miniErrorLog', { logStart: "", // 接下来的 4 个所以我创建了这个 jqueryui 小部件。它创建了一个 div，我可以将错误传输到其中。小部件代码如下所示： $.widget('ui.miniErrorLog', { logStart: "<ul>", // these next 4 elements are actually a bunch more complicated. logEnd: "</ul>", errStart: "<li>", errEnd: "</li>", content: "", refs: [], _create: function() { $(this.element).addClass( "ui-state-error" ).hide(); }, clear: function() { this.content = ""; for ( var i in this.refs ) $( this.refs[i] ).removeClass( "ui-state-error" ); this.refs = []; $(this.element).empty().hide(); }, addError: function( msg, ref ) { this.content += this.errStart + msg + this.errEnd; if ( ref ) { if ( ref instanceof Array ) this.refs.concat( ref ); else this.refs.push( ref ); for ( var i in this.refs ) $( this.refs[i] ).addClass( "ui-state-error" ); } $(this.element).html( this.logStart + this.content + this.logEnd ).show(); }, hasError: function() { if ( this.refs.length ) return true; return false; }, }); 我可以向其中添加错误消息，并且对页面元素的引用将进入错误状态。我用它来验证对话框。在“addError”方法中，我可以传入单个 id 或 id 数组，如下所示： $( "#registerDialogError" ).miniErrorLog( 'addError', "Your passwords don't match.", [ "#registerDialogPassword1", "#registerDialogPassword2" ] ); 但是当我传入一个 id 数组时，它不起作用。问题出在以下几行（我认为）： if ( ref instanceof Array ) this.refs.concat( ref ); else this.refs.push( ref ); 为什么这个 concat 不起作用。 this.refs 和 ref 都是数组。那么为什么 concat 不起作用？奖励：我在这个小部件中还做了其他愚蠢的事情吗？这是我的第一个。 concat方法不会改变原数组，需要重新赋值。 if ( ref instanceof Array ) this.refs = this.refs.concat( ref ); else this.refs.push( ref ); 原因如下：定义和用法 concat() 方法用于连接两个或多个数组。该方法不会改变已有的数组，而是返回一个新的数组，包含连接数组的值。您需要将串联结果分配回您拥有的数组中。扩展 Konstantin Dinev： .concat() 不会添加到当前对象，因此这将不起作用： foo.bar.concat(otherArray); 这将： foo.bar = foo.bar.concat(otherArray); 您必须使用 = 重新分配值到 array ，您想要获得连接值 let array1=[1,2,3,4]; let array2=[5,6,7,8]; array1.concat(array2); console.log('NOT WORK : array1.concat(array2); =>',array1); array1= array1.concat(array2); console.log('WORKING : array1 = array1.concat(array2); =>',array1); dataArray = dataArray.concat(array2) 其他人提到this.refs.concat(ref);分配并返回一个新数组，可以将其重新分配给对象：this.refs = this.refs.concat(ref);。 concat 不修改任何一个参数数组。但是，这里可能更准确的是使用 push，它将一个元素添加到调用数组中：this.refs.push(ref);（不使用 =--push 进行重新分配）返回新的数组长度，即通常被忽略）。如果您要添加多个项目，push接受变量参数，因此您可以将数组分散到其上： const arr = [0, 1, 2]; arr.push(3); // add one element console.log(arr) // => [0, 1, 2, 3] arr.push(4, 5); // add two elements console.log(arr) // => [0, 1, 2, 3, 4, 5] const toAdd = [6, 7, 8]; arr.push(...toAdd); // add an array console.log(arr); // => [0, 1, 2, 3, 4, 5, 6, 7, 8] concat 可以通过重新分配创建类似的结果： let arr = [0, 1, 2]; arr = arr.concat(3); // reassign with one new element console.log(arr) // => [0, 1, 2, 3] arr = arr.concat(4, 5); // reassign with two new elements console.log(arr) // => [0, 1, 2, 3, 4, 5] const toAdd = [6, 7, 8]; arr = arr.concat(toAdd); // reassign with a new array added console.log(arr); // => [0, 1, 2, 3, 4, 5, 6, 7, 8] concat 对于这个用例来说显然不太理想，但对于其他用例来说了解它很有用，特别是在需要不变性时（例如，在使用 React 状态时）。使用 push 进行变异的另一个方便之处是在应该改变其参数的函数中： const addOne = arr => { // contrived example arr.push(1); }; const arr = []; addOne(arr); console.log(arr); // => [1] as expected const addOneBroken = arr => { arr = arr.concat(1); // purely local reassignment! }; addOneBroken(arr); console.log(arr); // => still [1] 合并数组和项的另一个选项是展开语法，类似于 concat： let arr = [0, 1, 2]; const toAdd = [3, 4, 5]; const arr1 = [...arr, 3]; // add one item, similar to concat console.log(arr1); // [0, 1, 2, 3] const arr2 = [...arr, ...toAdd]; // add an array, similar to concat console.log(arr2); // [0, 1, 2, 3, 4, 5] arr = [-1, ...arr, 42, ...toAdd, 6, 7]; // build a new complex array and reassign console.log(arr); // => [-1, 0, 1, 2, 42, 3, 4, 5, 6, 7] 上述操作可以通过链式 concat 调用来完成： let arr = [0, 1, 2]; const toAdd = [3, 4, 5]; arr = [-1].concat(arr).concat(42).concat(toAdd).concat(6).concat(7); console.log(arr); // => [-1, 0, 1, 2, 42, 3, 4, 5, 6, 7] 请注意，如果您不想在 push 期间展平数组，只需跳过 ... 展开即可： const arr = [0, 1, 2]; const toAdd = [3, 4, 5]; arr.push(toAdd); console.log(arr); // => [0, 1, 2, [3, 4, 5]] concat方法不会改变原始数组，您可以使用数组解构。 const numbers = [1,2,3,4]; const newNumbers = [5,6,7,8,9]; numbers.push(...newNumbers); // [1,2,3,4,5,6,7,8,9] 请注意，如果您确实想在使用 concat 函数时拥有一个可变数组（可变数组是指它不会创建新数组，而是会改变现有数组），您可以为该数组实例重新分配 concat 函数。当我需要这个时，我就这么做了。 let myArray = []; myArray.concat= function( toAdd){ if(Array.isArray(toAdd)){ for(let node of toAdd) this.push(node); }else this.push(toAdd); }

javascript jquery jquery-ui

回答 8 投票 0

Jquery-UI 可拖动：当 droppable 动态更改大小时，“over”和“out”事件出现问题

我正在开发一个项目，我需要允许从侧边栏拖放到某些内容。非常重要的是，内容（当将其悬停在可拖动的情况下）会随着应用而扩展...

jquery-ui draggable droppable

回答 2 投票 0

如何在rails 6或rails 7 alpha引擎中使用jqueryUI

如果有人能够展示在 Rails 6 或 Rails 7 Alpha 2 引擎中使用 jquery ui 所需的确切步骤，我将不胜感激。我无法让 importmap-rails 在 Rails 7 引擎中工作...

ruby-on-rails jquery-ui ruby-on-rails-6 rails-engines ruby-on-rails-7

回答 1 投票 0

jQuery UI 可排序的占位符将元素推到其下方

我正在研究网上商店系统中图像管理器的概念。部分要求是，在产品级别，您可以上传该产品的图像，并通过拖动（排序）图像，您可以

jquery jquery-ui jquery-ui-sortable placeholder

回答 1 投票 0

JQUERY-ui对话框x按钮功能

我正在使用 jquery-ui 对话框。我的问题是单击 x 按钮关闭对话框后，我还需要执行 cancel() 函数。我该怎么做？变量内容= { 自动打开：

jquery jquery-ui jquery-ui-dialog

回答 3 投票 0

如何与sortable()一起实现Jquery数据表

我正在尝试实现数据表来创建一些时间表，并且表中的行是可拖动的。我使用 sortable 来实现这个功能这是我的 html 代码。我正在尝试实现数据表来创建一些时间表，并且表中的行是可拖动的。我使用 sortable 来实现这个功能这是我的 html 代码。 <link href="~/NewFolder1/jquery.dataTables.min.css" rel="stylesheet" /> <link href="~/NewFolder1/dataTables.tableTools.css" rel="stylesheet" /> <link href="~/mycss/Sortable.css" rel="stylesheet" /> <link href="~/Content/themes/base/jquery-ui.css" rel="stylesheet" /> <script src="~/NewFolder1/jquery-1.10.2.js"></script> <script src="~/NewFolder1/jquery-ui.js"></script> <script src="~/JScripts/jquery.dataTables.min.js"></script> <script src="~/NewFolder1/dataTables.tableTools.js"></script> <script src="~/JScripts/Sortable.js"></script> <div id="Dataelements"> <div id="Left-Content" style="width:50%;float:left;"> </div> <div id="Right-Content" style="width:49.5%;float:left;" > <table id="example" class="display"> <caption>Create Your Template</caption> <thead> <tr> <td>ID</td> <td>Name</td> <td>Duration</td> </tr> </thead> <tbody id="sortable" > </tbody> </table> </div> </div> <br /><br /> <hr /> <input type="submit" value="submit" id="button1"style="text-align:center;margin-top:50px;float:left;" /> 现在我的 JS 文件中的一些代码是 $("#sortable").sortable(); $('table#example').dataTable({ "aaSorting": [], }); var table = $('table#example').dataTable().api(); $("#button1").click(function () { var rows = $("#example").dataTable().fnGetNodes(); var cells = []; for (var i = 0; i < rows.length; i++) { cells.push($(rows[i]).find("td:eq(0)").html()); } alert(cells); }); 现在，在我单击按钮后，我正在检索表格的第一列假设在起始表= 1 HTML 2 2 PHP 5 3 JS 4 拖动并更改顺序后 2 PHP 5 3 JS 4 1 HTML 2 但是当我单击“提交”按钮时，我得到的输出为 1,2,3，而不是 2,3,1 有什么方法可以在拖动并更改顺序后保存行的状态。该代码对于普通表工作正常，但对于数据表则不行 jQuery UI 可排序功能包含一个序列化方法来执行此操作。这真的很简单。这是一个简单的示例，一旦元素位置发生更改，就会将数据发送到指定的 URL。 $('#element').sortable({ axis: 'y', update: function (event, ui) { var data = $(this).sortable('serialize'); // POST to server using $.post or $.ajax $.ajax({ data: data, type: 'POST', url: '/your/url/here' }); } }); 它的作用是使用元素 id 创建一个元素数组。所以，我通常会这样做： <ul id="sortable"> <li id="item-1"></li> <li id="item-2"></li> ... </ul> 当您使用序列化选项时，它将创建一个 POST 查询字符串，如下所示：item[]=1&item[]=2 等例如，在 PHP 中： foreach ($_POST['item'] as $value) { // do smth } 我的代码中有类似的东西并且它有效 (function(){ $('#datatable-ui').DataTable({ "fixedHeader": true, "responsive": true, "paging": false, "info": false, "aaSorting": [[ 1, "asc" ]], }); // http://www.foliotek.com/devblog/make-table-rows-sortable-using-jquery-ui-sortable/ var fixHelper = function(e, ui) { ui.children().each(function() { $(this).width($(this).width()); }); return ui; }; $("#datatable-ui tbody").sortable({ helper: fixHelper, update: function(event, ui) { $("#datatable-ui tbody tr").each(function(index){ $.ajax({ url: '{{ route('owner.item.position') }}', type: 'POST', data: 'restaurant_id='+$(this).data('restaurant-id')+'&item_id='+$(this).data('item-id')+'&position='+(index+1) }) .done(function (response) { console.log(response); }) .fail(function (jqXhr) { console.log(jqXhr); }); }); } }).disableSelection(); })(jQuery); 我正在从 tr 获取数据属性 @foreach($items as $item) <tr data-sortable="{{ $item->position }}" data-restaurant-id="{{ $restaurant->id }}" data-item-id="{{ $item->id }}"> 在 PHP 网站上它是标准的更新功能。我相信最好的方法是使用数据表行重新排序功能

javascript jquery jquery-ui jquery-ui-sortable

回答 3 投票 0

自动完成返回未定义

这是我的jquery函数： $(函数() { $("#user").autocomplete({ 来源：'spiderman/null/users.php', 最小长度：2 }); }); 当我开始输入至少 2 个字母时，我...

php jquery-ui autocomplete undefined

回答 2 投票 0

2021 年有 jQuery UI 的替代品吗？

所以这里向我展示的这个问题可能重复的是 2009-2012 年。我目前正在开发一个项目，该项目将受益于 jQuery UI .draggable() 和 .ressized() 方法...

javascript jquery jquery-ui bootstrap-4

回答 1 投票 0

更改联系表 7 中日期选择器的语言

我有一个翻译成两种语言的网站；英语和土耳其语。我希望此土耳其语页面上的日期选择器以土耳其语显示日期选择器 UI，而不是默认的英语