jQuery是一个Javascript库，考虑添加Javascript标记。 jQuery是一个流行的跨浏览器JavaScript库，它通过最小化浏览器之间的差异来促进文档对象模型（DOM）遍历，事件处理，动画和AJAX交互。标记为jquery的问题应该与jquery相关，因此有问题的代码应该使用jquery，并且至少需要jquery与用法相关的元素。
我有以下角度代码： {{新标签}} 我如何使用 ng-if 我有以下角度代码： <li ng-repeat="select in Items"> <foo ng-repeat="newin select.values"> {{new.label}}</foo> 如何使用 ng-if 条件来查找特定字符： ng-if="select.name == '?'" 仅当角色出现时才显示代码？我的值是 88?77，数字是动态的，但问号总是在那里，我似乎无法根据它进行过滤？ ES2015 更新 ES2015 有 String#includes 方法来检查一个字符串是否包含另一个字符串。如果目标环境支持的话就可以使用。如果在 haystack 中找到 needle，则该方法返回 true，否则返回 false。 ng-if="haystack.includes(needle)" 这里，needle是要在haystack中搜索的字符串。 请参阅 MDN 中的 浏览器兼容性 表。请注意，IE 和 Opera 不支持此功能。在这种情况下可以使用polyfill。 您可以使用String#indexOf来获取haystack中needle的索引。 如果针不存在于干草堆中，则返回-1。 如果needle出现在haystack的开头，则返回0。 否则返回 needle 所在的索引。 索引可以与-1进行比较，以检查haystack中是否找到needle。 ng-if="haystack.indexOf(needle) > -1" 对于 Angular(2+) *ngIf="haystack.includes(needle)" ng-if="select.name.indexOf('?') !== -1" 所有 JavaScript 方法都适用于 AngularJS，因为 AngularJS 本身是一个 JavaScript 框架，所以你可以在 Angular 指令中使用 IndexOf() <li ng-repeat="select in Items"> <foo ng-repeat="newin select.values"> <span ng-if="newin.label.indexOf(x) !== -1">{{newin.label}}</span></foo> </li> //where x is your character to be found 在 Angular2 中你应该考虑使用（纯）管道来实现这一点 您可以考虑添加自己的自定义“包含”管道： import { Pipe, PipeTransform } from '@angular/core'; @Pipe({ name: 'includes', }) export class Includes implements PipeTransform { public transform(haystack: string, needle: string): boolean; public transform<T>(array: T[], item: T): boolean; public transform(haystack: any[]|string, needle: any|string): boolean { return haystack.includes(needle); } } 此管道既可用于在数组中查找项目，也可在字符串搜索中查找字符串。 您可以在模板中使用此管道，如下所示： <div *ngIf="haystack | includes : needle"> //... <div> 注意：这似乎是很大的开销，因为您可以按照其他答案中的建议进行操作： <div *ngIf="haystack.includes(needle)"> //... </div> 但是当使用这样的解决方案时，每次更改检测都会调用 includes 方法，即使在 haystack 的值没有更改的情况下也是如此。通过使用管道，您将确保它仅在 haystack 更改时执行。 有关此主题的更多信息，请参阅有关纯管道的 Angular 官方文档。 只有快捷语法对我有用*ngIf。 （如果我没记错的话，应该是以后的版本使用了这个语法） <div *ngIf="haystack.indexOf('needle') > -1"> </div> 或 <div *ngIf="haystack.includes('needle')"> </div> 在控制器函数中进行类似的检查。您的 HTML 应该是易于阅读的标记，没有逻辑。 控制器： angular.module("myApp") .controller("myController",function(){ var self = this; self.select = { /* ... */ }; self.showFoo = function() { //Checks if self.select.name contains the character '?' return self.select.name.indexOf('?') != -1; } }); 页面示例： <div ng-app="myApp" ng-controller="myController as vm"> <p ng-show="vm.showFoo()">Bar</p> </div>
有没有函数或方法可以阻止 setinterval 函数在 jQuery 或 JS 中的匹配后继续运行？
我正在开发的项目生成了2个不同的p元素，并且每个元素都是独立触发的。回调后大约需要5秒加载。我无法控制这些 p
有没有办法像 IE 一样自动在 Firefox 中显示 alt="text" 作为鼠标悬停工具提示？
我不想再次重复标题中的替代文本？ 这可以用任何 javascript 、 jquery 、 css 解决方案吗？或任何可以禁用显示 alt=text 并启用 title=texr 并作为工具提示的解决方案？
我目前对 jquery Tabs UI 为选项卡生成 div 的方式遇到问题。 通常，用户首先会调用 $("tabs").tab() 来初始化选项卡。 <... 我目前对 jquery Tabs UI 为选项卡生成 div 的方式遇到问题。 通常，用户首先会调用 $("tabs").tab() 来初始化选项卡。 <div id="tabs"> <ul> <li> <a href="controls/form_unassigned.html" id="channel1_link">CH1 N/A</a> </li> <li> <a href="controls/form_srw.html" id="channel2_link">CH2 N/A</a> </li> </ul> </div> 这将创建 <div id="ui-tabs-1" class="ui-tabs-panel ui-widget-content ui-corner-bottom"> </div> <div id="ui-tabs-2" class="ui-tabs-panel ui-widget-content ui-corner-bottom"> </div> 这就是 div id 为“ui-”++ 的预期结果。 但是，如果您调用 $("tabs").tab() 再次初始化而不刷新浏览器，则递增的 id 不会从 0 开始，而是从 2 开始。因此选项卡将设置为： <div id="ui-tabs-3" class="ui-tabs-panel ui-widget-content ui-corner-bottom"> </div> <div id="ui-tabs-4" class="ui-tabs-panel ui-widget-content ui-corner-bottom"> </div> 但是，我想要的效果是每次调用initialize时id都从0开始。 因此，我想要 1/2，而不是 div id 的 3/4。 我尝试在每个初始化的开头调用 .tabs('destroy') 希望这会重置自动生成的 id，但这也不起作用。 我在 jquery 选项卡 UI 上找不到任何内容来解决此问题，或者也许我只是没有看到它。 我希望 id 从 0 开始的原因是因为我使用这个特定的 div 来动态填充内容。 任何建议表示赞赏，谢谢！ D 不修改 jQuery UI 源代码是不可能的。 tabId仅从包装选项卡模块的匿名函数内部可见，并且它不会“导出”任何函数来更改它。 如果您可以接受非常肮脏的黑客攻击，请在函数中添加以下内容： window.resetTabID = function() { tabId = 0; } 这将允许您调用全局函数resetTabID()来重置选项卡ID。但是，你最好不要使用这样的 hack。 Per this post - 使用标题属性。 <div id="example"> <ul> <li><a href="ahah_1.html"><span>Content 1</span></a></li> <li><a href="ahah_2.html"><span>Content 2</span></a></li> <li><a href="ahah_3.html"><span>Content 3</span></a></li> </ul> </div> Obviously this degrades gracefully - the links, e.g. the content, will still be accessible with JavaScript disabled. Note that if you wish to reuse an existing container, you could do so by matching a title attribute and the container's id: <li><a href="hello/world.html" title="Todo Overview"> ... </a></li> and a container like: <div id="Todo_Overview"> ... </div> 效果很好！ 您可以使用 aria-controls 设置选项卡 id <div id="tabs"> <ul> <li aria-controls="tab-mycustomid"> <a href="controls/form_unassigned.html" id="channel1_link">CH1 N/A</a> </li> .... 我发现在页面加载时更改到正确的选项卡时很有用
我有一个对话框#acronymPickerDialog，单击#cancelBtn 时该对话框会被销毁。但是现在我注意到，当我单击退出按钮时，尽管该框似乎已关闭，但它仍然保持 p...
如果我的屏幕宽度小于 960 像素，如何让 jQuery 执行某些操作？无论我的窗口大小如何，下面的代码总是触发第二个警报： if (屏幕.宽度 < 960) { alert('Les...
这是我的带有可折叠导航栏的代码。切换按钮打开但不关闭菜单： 这是我的带有可折叠导航栏的代码。切换按钮打开但不关闭菜单： <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css" integrity="sha384-4LISF5TTJX/fLmGSxO53rV4miRxdg84mZsxmO8Rx5jGtp/LbrixFETvWa5a6sESd" crossorigin="anonymous"> <script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script> <script src="https://code.jquery.com/ui/1.14.0/jquery-ui.min.js" integrity="sha256-Fb0zP4jE3JHqu+IBB9YktLcSjI1Zc6J2b6gTjB0LpoM=" crossorigin="anonymous"></script> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous"> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-BBtl+eGJRgqQAUMxJ7pMwbEyER4l1g+O15P+16Ep7Q9Q+zqX6gSbd85u4mG4QzX+" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/2.9.2/umd/popper.min.js"></script> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/select2-bootstrap-5-theme.min.css" /> <nav class="navbar navbar-expand-lg navbar-dark" style="background-color: #134d8c;"> <div class="container-fluid"> <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarSupportedContent"> <ul class="navbar-nav me-auto mb-2 mb-lg-0"> <li class="nav-item"> <a href="/www" class="nav-link <?php echo ($page == 'home') ? 'active' : '' ?>"> <i class="fs-5 bi-house"></i> <span class="ms-1 me-2 d-none d-sm-inline">Home</span> </a> </li> <li class="nav-item"> <a href="parametri.php" class="nav-link <?php echo ($page == 'parametri') ? 'active' : '' ?>"> <i class="fs-5 bi-gear"></i> <span class="ms-1 me-2 d-none d-sm-inline">Parametri</span> </a> </li> <li class="nav-item"> <a href="anagrafiche.php?nav=anagrafica_alunni" class="nav-link <?php echo ($page == 'anagrafica_alunni') ? 'active' : '' ?>"> <i class="fs-5 bi-backpack2"></i> <span class="ms-1 me-2 d-none d-sm-inline">Anagrafica alunni</span> </a> </li> <li class="nav-item"> <a href="anagrafiche.php?nav=anagrafica_famiglie" class="nav-link <?php echo ($page == 'anagrafica_famiglie') ? 'active' : '' ?>"> <i class="fs-5 bi-people"></i> <span class="ms-1 me-2 d-none d-sm-inline">Anagrafica famiglie</span> </a> </li> <li class="nav-item"> <a href="bonus.php" class="nav-link <?php echo ($page == 'bonus') ? 'active' : '' ?>"> <i class="fs-5 bi-trophy"></i> <span class="ms-1 me-2 d-none d-sm-inline">Bonus</span> </a> </li> <li class="nav-item"> <a href="turni_pulizie.php" class="nav-link <?php echo ($page == 'turni_pulizie') ? 'active' : '' ?>"> <i class="fs-5 bi-trash"></i> <span class="ms-1 me-2 d-none d-sm-inline">Turni pulizie</span> </a> </li> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false"> <i class="fs-5 bi-cookie"></i> Turni cucina </a> <ul class="dropdown-menu" aria-labelledby="navbarDropdown"> <li><a href="turni_cucina.php" class="ms-1 me-2 nav-link <?php echo ($page == 'turni_cucina') ? 'active' : '' ?>">Calendario</a></li> <li><a href="turni_cucina_famiglie.php" class="ms-1 me-2 nav-link <?php echo ($page == 'turni_cucina_famiglie') ? 'active' : '' ?>">Famiglie</a></li> <li><a href="turni_fissi_cucina.php" class="ms-1 me-2 nav-link <?php echo ($page == 'turni_fissi_cucina') ? 'active' : '' ?>">Fissi</a></li> <li><a href="turni_cucina_scambi.php" class="ms-1 me-2 nav-link <?php echo ($page == 'turni_cucina_scambi') ? 'active' : '' ?>">Scambi</a></li> <li><a href="turni_cucina_pagamenti.php" class="ms-1 me-2 nav-link <?php echo ($page == 'turni_cucina_pagamenti') ? 'active' : '' ?>">Pagamenti</a></li> </ul> </li> </ul> </div> </div> </nav> 我发现this类似的问题，但我的代码似乎已经如答案所示（在引导之前包括jquery）。 为什么它只能以一种方式起作用？ 通过删除bootstrap.bundle.min.js，它可以正常工作。 可能与bootstrap.min.js有冲突 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css" integrity="sha384-4LISF5TTJX/fLmGSxO53rV4miRxdg84mZsxmO8Rx5jGtp/LbrixFETvWa5a6sESd" crossorigin="anonymous"> <script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script> <script src="https://code.jquery.com/ui/1.14.0/jquery-ui.min.js" integrity="sha256-Fb0zP4jE3JHqu+IBB9YktLcSjI1Zc6J2b6gTjB0LpoM=" crossorigin="anonymous"></script> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous"> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-BBtl+eGJRgqQAUMxJ7pMwbEyER4l1g+O15P+16Ep7Q9Q+zqX6gSbd85u4mG4QzX+" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/2.9.2/umd/popper.min.js"></script> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/select2-bootstrap-5-theme.min.css" /> <nav class="navbar navbar-expand-lg navbar-dark" style="background-color: #134d8c;"> <div class="container-fluid"> <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarSupportedContent"> <ul class="navbar-nav me-auto mb-2 mb-lg-0"> <li class="nav-item"> <a href="/www" class="nav-link <?php echo ($page == 'home') ? 'active' : '' ?>"> <i class="fs-5 bi-house"></i> <span class="ms-1 me-2 d-none d-sm-inline">Home</span> </a> </li> <li class="nav-item"> <a href="parametri.php" class="nav-link <?php echo ($page == 'parametri') ? 'active' : '' ?>"> <i class="fs-5 bi-gear"></i> <span class="ms-1 me-2 d-none d-sm-inline">Parametri</span> </a> </li> <li class="nav-item"> <a href="anagrafiche.php?nav=anagrafica_alunni" class="nav-link <?php echo ($page == 'anagrafica_alunni') ? 'active' : '' ?>"> <i class="fs-5 bi-backpack2"></i> <span class="ms-1 me-2 d-none d-sm-inline">Anagrafica alunni</span> </a> </li> <li class="nav-item"> <a href="anagrafiche.php?nav=anagrafica_famiglie" class="nav-link <?php echo ($page == 'anagrafica_famiglie') ? 'active' : '' ?>"> <i class="fs-5 bi-people"></i> <span class="ms-1 me-2 d-none d-sm-inline">Anagrafica famiglie</span> </a> </li> <li class="nav-item"> <a href="bonus.php" class="nav-link <?php echo ($page == 'bonus') ? 'active' : '' ?>"> <i class="fs-5 bi-trophy"></i> <span class="ms-1 me-2 d-none d-sm-inline">Bonus</span> </a> </li> <li class="nav-item"> <a href="turni_pulizie.php" class="nav-link <?php echo ($page == 'turni_pulizie') ? 'active' : '' ?>"> <i class="fs-5 bi-trash"></i> <span class="ms-1 me-2 d-none d-sm-inline">Turni pulizie</span> </a> </li> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false"> <i class="fs-5 bi-cookie"></i> Turni cucina </a> <ul class="dropdown-menu" aria-labelledby="navbarDropdown"> <li><a href="turni_cucina.php" class="ms-1 me-2 nav-link <?php echo ($page == 'turni_cucina') ? 'active' : '' ?>">Calendario</a></li> <li><a href="turni_cucina_famiglie.php" class="ms-1 me-2 nav-link <?php echo ($page == 'turni_cucina_famiglie') ? 'active' : '' ?>">Famiglie</a></li> <li><a href="turni_fissi_cucina.php" class="ms-1 me-2 nav-link <?php echo ($page == 'turni_fissi_cucina') ? 'active' : '' ?>">Fissi</a></li> <li><a href="turni_cucina_scambi.php" class="ms-1 me-2 nav-link <?php echo ($page == 'turni_cucina_scambi') ? 'active' : '' ?>">Scambi</a></li> <li><a href="turni_cucina_pagamenti.php" class="ms-1 me-2 nav-link <?php echo ($page == 'turni_cucina_pagamenti') ? 'active' : '' ?>">Pagamenti</a></li> </ul> </li> </ul> </div> </div> </nav>
我正在使用 Gridstack js 为仪表板创建可拖动/可调整大小的小部件。图片显示了一个示例小部件。我保留了默认的可拖动值，我可以通过双击来拖动它
data.value 未定义，但由于某种原因 data 具有所有数据 ajax [已关闭]
我只想从这个数组中检索值。我尝试了 data[0].title 但它不起作用。 $.ajax({ 类型：“帖子”， url: 'videos_load.php', 数据：过滤器， 成功：功能（达...
这是导航栏的一部分 会计 这是导航栏的一部分 <li> <a href="#Menu_20" title="Accounting" > <i class="fa fa-money fa-lg"></i><strong>Accounting</strong> </a> <ul> <li> <a href="#Menu_21"> <i class="fa fa-plus-square fa-lg"></i>Income </a> <ul> <li> <a href="#Menu_49"><i class="fa fa-gift fa-lg"></i>Customers</a> </li> <li> <a href="#Menu_50"><i class="fa fa-gift fa-lg"></i>Aged Analysis</a> </li> <li> <a href="#Menu_51"><i class="fa fa-gift fa-lg"></i>Prepayments</a> </li> <li> <a href="#Menu_52"><i class="fa fa-gift fa-lg"></i>Documents</a> </li> 这是相关的CSS .mcd-menu li ul, .mcd-menu li ul li ul { position: absolute; height: auto; min-width: 200px; padding: 0; margin: 0; background: #FFF; /*border-top: 4px solid #e67e22;*/ opacity: 0; visibility: hidden; transition: all 300ms linear; -o-transition: all 300ms linear; -ms-transition: all 300ms linear; -moz-transition: all 300ms linear; -webkit-transition: all 300ms linear; /*top: 130px;*/ z-index: 1000; /* == */ left: 280px; top: 0px; /*<-------------------------- Set at 0px ------------- this positions the element - */ border-left: 4px solid #e67e22; /* == */ } .mcd-menu li ul:before { content: ""; position: absolute; top: 25px; /*<----------------- Set at 25 px ---------------- this positions the pointer*/ left: -9px; border-right: 5px solid #e67e22; border-bottom: 5px solid transparent; border-top: 5px solid transparent; /* == */ } 我可以找到 href 元素 $('a[href*="#"]').mouseover(function (event) { var href = $(this).attr('href'); if (href == "#Menu_22") { $(this).parent().css({ "top": "200px;" }) } }） 但无法找到更改 li 和 ul 元素上的 css 的方法。我将用 document.ready 替换 mouseover，但目前可以很方便地查看是否有任何东西触发 编辑 这是我试图实现的第一个图像是使用标准 CSS 设置（0px 和 25px） - 第二个图像将视图向上移动并使其更具可读性 - 设置更改为 -200px 和 195px。 这应该针对所选锚点下方的第一个无序列表。 $(this).parent().children("ul").first().css({ "top": "200px" });
我遵循以下针对我的图表场景的答案，我在渲染图表、过滤图表等预期功能方面没有问题。 编辑 Google 图表类别过滤器 我的问题...
我正在处理 jQuery 代码，如下所示： 函数表单提交() { $('#myform').attr('action', "./myFilter.action"); $('#myform').submit(); } 形式： 我正在处理 jQuery 代码如下： function formSubmit() { $('#myform').attr('action', "./myFilter.action"); $('#myform').submit(); } 形式： <s:form name="myform" action="myAction" id="myform"> </s:form> 注意到 myFilter.action 在 myAction 之前被调用。但我不明白这是如何或为何发生的。有人可以解释一下吗？ 假设 <s:form> 被浏览器视为 HTML <form> 元素：* jQuery 代码使用 .attr() 来更改表单的 [action] 属性。 [action]属性告诉表单通过 GET 或 POST 请求将数据发送到哪个 URL，具体取决于 [method] 属性的设置。 然后使用 .submit() 方法强制表单将其包含的数据提交到先前指定的 URL。 * 这是一个相当大的假设，因为 s: 命名空间可能是几乎任何东西的别名，因此不清楚在没有额外上下文的情况下如何使用该元素。 如果您处理按钮的 onclick 事件（没有提交事件），则可以使用该代码。 <button onclick="formSubmit()">Submit</button>
我是 OES（在线考试系统）的新手。我想在安全的环境下进行在线考试，用户将无法作弊 请帮忙做这件事。 我正在使用带有 Codeigniter 框架的 PHP...
我对java脚本比较陌生。我想创建一个项目，在其中我需要拖放来重新排列项目的顺序。我不知道如何解决这个问题，我想知道是否有......
我有一个带有以下 DOM 树的代码： 我有一个带有以下 DOM 树的代码： <div id="blogPagination"> <div class="pagination"> <ul> <li> <a href="/2" >1</a> </li> <li> <a href="/3" >2</a> </li> </ul> </div> </div> 我正在尝试访问我的标签的 href。我尝试过任何方法都无法达到目标。 使用 jQuery 实现这一目标的最佳方法是什么？ 我尝试过： console.log($('#blogPagination div ul > li a ').attr("href")); console.log($('#blogPagination > a ').attr("href")); $('#blogPagination').children('a') console.log($('#blogPagination div ul li a').attr("href")); 没有运气.. 谢谢 编辑： 在 nbrooks 回答之后，这是我迄今为止尝试过的： function bindPagination() { console.log("bind"); $(function() { var links = $("#blogPagination ul a").map(function(e) { e.preventDefault(); return this.href; }).get(); console.log(links); }); 编辑2： 考虑到Syfaro的回答，我也尝试过： $('#blogPagination').find('a').each(function(e) { e.preventDefault(); console.log($(this).attr('href')); }); 没有运气。 编辑3： 我想提供有关此功能的更多详细信息，毕竟它可能会产生重大影响： 为了加载此分页，我使用 Ajax 并将手柄包装到文档就绪函数中： $(document).ready(function(){ // Get the customer service stats var Content = { init: function() { /* this.getHomePosts(); */ this.getBlogPosts(); }, getBlogPosts: function(offset) { if(offset == undefined){ offset = 0; } // GET the events with JSON $.ajax({ type: "POST", data: {}, url: site_url+"/main/blog/"+offset, dataType: "json", success: function(results) { posts = results["posts"].map(function (blogContent) { if( blogContent.picture != '' ) { return { Title: blogContent.title , Picture: Content.urlPostPic + blogContent.picture , Video: '' , Text: blogContent.text , Datetime: blogContent.datetime , } } else { return { Title: blogContent.title , Picture: '' , Video: blogContent.video , Text: blogContent.text , Datetime: blogContent.datetime , } } }); pagination = {pagination: results["pagination"]}; var template = Handlebars.compile( $('#templateBlog').html() ); $('#blogPosts').append( template(posts) ); var template = Handlebars.compile( $('#templatePagi').html() ); $('#blogPagination').append( template(pagination) ); // Here we call bindPagination <=== bindPagination(); } }); }, }; Content.init(); 您可以在 get BlogPosts 函数中看到我调用 BindPagination ，它应该是这个函数，以防止默认行为并根据偏移量（分页系统）调用内容 function bindPagination() { console.log("bind"); var links = $("#blogPagination ul a").map(function(e) { e.preventDefault(); return this.href; }).get(); console.log(links); $('#blogPagination').find('a').each(function(e) { console.log("clicked !"); e.preventDefault(); console.log($(this).attr('href')); // var attr = this.attr(); // var id = attr.replace("/",""); // $('#blogPosts').empty(); // $('#blogPagination').empty(); // Content.getBlogPosts(id); }); } }); 最后一个});代表文档结尾已准备好。 $('#blogPagination').find('a').attr('href'); 这应该找到指定区域中的所有 a 元素，并获取它们的 href，假设您已经设置了 jQuery 和所有这些好东西。 如果你有多个 a 元素，你可以这样做： $('#blogPagination').find('a').each(function() { console.log($(this).attr('href')); }); 这将打印出该 href 中每个 a 的每个 div。 如果需要防止链接更改页面，则需要向 a 元素添加点击处理程序。 $('#blogPagination').on('click', 'a', function(e) { e.preventDefault(); console.log($(this).attr('href')); }); 这将阻止用户被带到该链接，并在单击时获得该链接的 href。 这是你想要的吗？ 您可能正在寻找的功能是map。这允许您获取给定的 jQuery 集合，并通过获取每个对象的特定属性并将其作为结果集合中的元素来转换它。 收集数组中的所有 href： $(function() { var links = $("#blogPagination ul a").map(function() { return this.href; }).get(); console.log(links); }); jsFiddle 演示 注意： 子选择器 (el1 > el2) 仅当 el2 是 el1 的直接后代时才起作用。所以至少你的一个例子会失败，因为你的例子与你的 DOM 树不匹配。但是，假设您将其包装在 DOM 就绪处理程序中，console.log($('#blogPagination div ul > li a ').attr("href")); 可以找到（仅）第一个锚标记的 href。 $(function() { ... });方法类似，因为它只会查找直接后代（子代），而不是孙子等。如果您想在特定元素的 DOM 树中查找 all 后代，请使用 children 代替。 普通的 Javascript 解决方案 find 检查您的控制台 - 因为我怀疑存在冲突或 JavaScript 错误导致 jQuery 无法工作。 您的陈述是正确的，应该选择您需要的元素。 Vannila Javascript 解决方案 document.querySelectorAll("div #blogPagination a").forEach((item)=>console.log(item.href)); Array.prototype.map.call(document.querySelectorAll(".myselectorAreaofLinks"), function (e) { return e.getAttribute('href'); }); 方法是jQuery提供的方法，允许您选择具有特定后代元素的元素。要选择 .has() 内包含锚标记的链接，然后检索这些标记，我们可以使用此方法。下面是实现相同目的的示例。div 此示例首先借助 $('div:has(a)').find('a').each(function() { $(this).css('color', 'red'); }); 选择器选择所有包含锚标记的 div。之后，它在每个 :has() 元素上调用 find() 方法，以检索作为其后代的所有锚标记。最后，div方法用于迭代每个链接以添加或更改样式，或执行任何其他操作。
我正在使用这个插件，我将一个确认方法包装到函数中，这样我每次都可以使用它https://jsfiddle.net/8g0j4unj/ 函数提问（$msg）{ $.确认({ 图标：'fa fa-问题-
如果您使用调整图像大小，图像会非常模糊，例如显示尺寸调整后的小图像，例如； 它在 o...
查看代码： {{ csrf_field() }} 查看代码： <form enctype="multipart/form-data" name="imagesform" id="imagesform" action="{{url('upload')}}" method="post" > {{ csrf_field() }} <input name="images[]" type="file" multiple> <button type="submit" class="save" id="saveImage" style="border- radius: 8px; padding: 5px 15px;">SAVE</button> </form> 这是 Laravel 视图代码。这里我尝试将多个图像上传到数据库中。 AJAX 代码： <script type="text/javascript"> $(document).ready(function(){ $("#imagesform").submit(function(){ $.ajaxSetup({ headers: { 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content') } }); $.ajax({ url :"{{url('upload')}}", type: 'POST', data:new FormData($("#imagesform").get(0)), contentType:false, processData:false, success: function (data) { **$("#insertedImages").html(data);** alert("Uploaded OK!") }, }); return false; }); }); </script> 这是我存储图像的ajax请求。另外，我正在尝试显示那些添加的图像（在块中标记）。 控制器代码： public function uploadSubmit(UploadRequest $request) { $product = Product::create($request->all()); foreach ($request->images as $photo) { $filename = $photo->store('uploadedImages'); $filename=substr($filename,15); ProductsPhoto::create([ 'product_id' => $product->id, 'filename' => $filename ]); } return $filename; } 这是我的控制器，用于插入这些图像数组并返回相同的图像。但是，它仅显示图像的名称。 即.,eZrcSTlkCeGez8Dq6pTW5X1yLUA080W5UamQEfXk.png..我不想像这样显示它，而是想显示图像。 图像显示： <div id="insertedImages"></div> 这就是我用来显示图像的。 如果您在ajax中获取image_name，您可以将其与完整图像路径连接 <script type="text/javascript"> $(document).ready(function(){ $("#imagesform").submit(function(){ $.ajaxSetup({ headers: { 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content') } }); $.ajax({ url :"{{url('upload')}}", type: 'POST', data:new FormData($("#imagesform").get(0)), contentType:false, processData:false, success: function (data) { var img = '<img src="{{asset(Storage::url('uploadedImages'))}}/'+data+'" width="100" height="100" id="insertedImages">'; $("#insertedImages").html(img); alert("Uploaded OK!") }, }); return false; }); }); </script> 首先，您要上传图像数组并返回一个变量，该变量仅返回最后上传的文件的名称。相反，创建并返回上传文件的文件名数组。 public function uploadSubmit(UploadRequest $request) { $product = Product::create($request->all()); $filenames = array(); foreach ($request->images as $photo) { $filename = $photo->store('uploadedImages'); $filename = substr($filename,15); $filenames[] = asset('storage/app/uploadedImages/'.$filename); ProductsPhoto::create([ 'product_id' => $product->id, 'filename' => $filename ]); } return response()->json($filenames); } 然后确保运行 php artisan storage:link 在 storage 目录中创建 public 目录的符号链接。 <script type="text/javascript"> $(document).ready(function(){ $("#imagesform").submit(function(){ $.ajaxSetup({ headers: { 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content') } }); $.ajax({ url :"{{url('upload')}}", type: 'POST', data:new FormData($("#imagesform").get(0)), contentType:false, processData:false, success: function (data) { $.each(data, function( index, value ) { $("#insertedImages").append('<img src="'+value+'">'); }); }, }); return false; }); }); </script> 我有同样的问题...图像是公开的：storage/images/image.png，当我尝试这样做时，路线是（http://127.0.0.1:8000/dashboard/category） success:function(response){ = $.each(response.res,function(key, subcat){ $('#table').append('<div class="flex min-w-10 items-center justify-start gap-2 py-2"}`>\ <img src="/storage/assets/images/subcat/'+subcat.image+')" class="w-16" alt="image">\); 不工作BCS我得到这个作为网址http://127.0.0.1:8000/dashboard/category/storage/assets/images/subcat/image.png 这是一个 404 错误
如何在显示侧边栏时禁用背景并单击除侧边栏之外的任何位置将关闭侧边栏
我正在为我的网站制作侧边栏。 当我的侧边栏出现（单击 showRight）时，我想禁用背景内容，以便用户无法在菜单之外执行任何操作。 当用户点击...
尝试使用ajax提交表单，但它不起作用 $('#Submit').on('点击',function(){ $.ajax({ 类型：'获取'， url: 'ItemProcessor.php', 数据：$('#input_form').