jquery 相关问题

IGGRID过滤在多个列（IGNITE-UI）上动态添加过滤器

//value is multiple columns filter details separated by ; var columns = value.split(";") for (i = 0; i < columns.length; i++) { state_grid.igGridFiltering("filter", [{ fieldName: columns[i][0], expr: columns[i][2], cond: columns[i][1] }]); }

如何验证形式在jQuery

这里是我当前的HTML形式： <form id="myForm"> <label for="name">Name:</label> <input type="text" id="name" name="name"> <label for="email">Email:</label> <input type="text" id="email" name="email"> <button type="submit">Submit</button> </form> 到目前为止，我的jQuery代码： $(document).ready(function () { $("#myForm").submit(function (event) { var name = $("#name").val(); var email = $("#email").val(); if (name.trim() === "") { alert("Name is required"); event.preventDefault(); } var emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; if (!emailPattern.test(email)) { alert("Invalid email address"); event.preventDefault(); } }); }); 尽管这似乎有效，但我想知道： 这是使用jQuery验证表格的最佳方法吗？ 我可以做出任何改进以避免重复event.preventdefault（）调用吗？ 我应该考虑使用jQuery验证插件吗？ 任何指导或最佳实践都将不胜感激！ 为什么要努力工作，您可以通过添加HTML属性（必需）并将输入设置为type Email。 您的JS看起来很稳定，但是无论哪种方式，都记住在服务器端验证，因为所有客户端可以禁用或绕过所有客户端。 <form id="myForm"> <label for="name">Name:</label> <input type="text" id="name" name="name" required> <label for="email">Email:</label> <input type="email" id="email" name="email" required> <button type="submit">Submit</button> </form>

bootstrap将活动类添加到li

使用Twitter引导程序，我需要将活动类启动到主NAV的LI部分。自动。 我们使用PHP而非Ruby。 样本nav： 使用Twitter引导程序，我需要将活动类启动到主NAV的LI部分。自动。 我们使用php而非红宝石。 sample nav： <ul class="nav"> <li><a href="/">Home</a></li> <li><a href="/forums">Forums</a></li> <li><a href="/blog">Blog</a></li> <li><a href="/faqs.php">FAQ's</a></li> <li><a href="/item.php">Item</a></li> <li><a href="/create.php">Create</a></li> </ul> Bootstrap代码如下： <li class="active"><a href="/">Home</a></li> 因此，只需要弄清楚如何将活动的类附加到当前页面即可。在堆栈上几乎通过每个答案看上去都没有真正的喜悦。 我玩过的： /*menu handler*/ $(function(){ var url = window.location.pathname; var activePage = url.substring(url.lastIndexOf('/')+1); $('.nav li a').each(function(){ var currentPage = this.href.substring(this.href.lastIndexOf('/')+1); if (activePage == currentPage) { $(this).parent().addClass('active'); } }); }) 但没有欢乐 为Bootstrap 3： var url = window.location; // Will only work if string in href matches with location $('ul.nav a[href="'+ url +'"]').parent().addClass('active'); // Will also work for relative and absolute hrefs $('ul.nav a').filter(function() { return this.href == url; }).parent().addClass('active'); update 为Bootstrap 4： var url = window.location; // Will only work if string in href matches with location $('ul.navbar-nav a[href="'+ url +'"]').parent().addClass('active'); // Will also work for relative and absolute hrefs $('ul.navbar-nav a').filter(function() { return this.href == url; }).parent().addClass('active'); 我们最终设法解决了： /*menu handler*/ $(function(){ function stripTrailingSlash(str) { if(str.substr(-1) == '/') { return str.substr(0, str.length - 1); } return str; } var url = window.location.pathname; var activePage = stripTrailingSlash(url); $('.nav li a').each(function(){ var currentPage = stripTrailingSlash($(this).attr('href')); if (activePage == currentPage) { $(this).parent().addClass('active'); } }); }); 您真的不需要带有bootstrap的JavaScript： <ul class="nav"> <li><a data-target="#" data-toggle="pill" href="#accounts">Accounts</a></li> <li><a data-target="#" data-toggle="pill" href="#users">Users</a></li> </ul> 在选择菜单项之后，要执行更多任务，您需要JS，如此处的其他帖子所述。 希望这帮助 如果你放 data-toggle="pill" 在标签中应该自动工作。 http：//twitter.github.com/bootstrap/javascript.html#tabs 在标记下阅读 这为我完成了这项工作，包括主动的主要下拉列表和活跃的儿童（感谢422）： $(document).ready(function () { var url = window.location; // Will only work if string in href matches with location $('ul.nav a[href="' + url + '"]').parent().addClass('active'); // Will also work for relative and absolute hrefs $('ul.nav a').filter(function () { return this.href == url; }).parent().addClass('active').parent().parent().addClass('active'); }); 如果您使用的MVC框架与路线和操作： $(document).ready(function () { $('a[href="' + this.location.pathname + '"]').parent().addClass('active'); }); 在克里斯蒂安·兰德格伦（Christian Landgren）的答案中所述： https：//stackoverflow.com/a/13375529/101662 尝试这个。 // Remove active for all items. $('.page-sidebar-menu li').removeClass('active'); // highlight submenu item $('li a[href="' + this.location.pathname + '"]').parent().addClass('active'); // Highlight parent menu item. $('ul a[href="' + this.location.pathname + '"]').parents('li').addClass('active'); 这对我来说很好。它将简单的NAV元素和下拉导航元素标记为Active. $(document).ready(function () { var url = window.location; $('ul.nav a[href="' + this.location.pathname + '"]').parent().addClass('active'); $('ul.nav a').filter(function() { return this.href == url; }).parent().parent().parent().addClass('active'); }); 将this.location.pathname到$('ul.nav a[href="'...'"]')标记也简单的导航元素。通过url为我不工作。 如果您在Angulajs中使用Boostrap：这是一个对我有用的简单指令（因为KAM引用的数据与我不包含在Angular-UI中）。希望可以帮助 app.directive("myDataToggle", function(){ function link(scope, element, attrs) { var e = angular.element(element); e.on('click', function(){ e.parent().parent().children().removeClass('active'); e.parent().addClass("active"); }) } return { restrict: 'A', link: link }; }); <ul class="nav nav-sidebar"> <li><a href="#/page1" my-data-toggle>Page1</a></li> <li><a href="#/page2" my-data-toggle>Page2</a></li> <li><a href="#/page3" my-data-toggle>Page3</a></li> </ul> 解决方案很简单，不需要服务器端或AJAX，您只需要jQuery和bootstrap即可。在每个页面上，在id标签中添加一个body。使用该id查找包含页名的标签（标签的值）。 示例： Page1.html <body id="page1"> <ul class="nav navbar-nav"> <li><a href="page1.html">Page1</a></li> <li><a href="page2.html">Page2</a></li> </ul> <script src="script.js"></script> </body> -page2.html <body id="page2"> <ul class="nav navbar-nav"> <li><a href="page1.html">Page1</a></li> <li><a href="page2.html">Page2</a></li> </ul> <script src="script.js"></script> </body> Script.js <script> $(function () { $("#page1 a:contains('Page1')").parent().addClass('active'); $("#page2 a:contains('Page2')").parent().addClass('active'); }); </script> big感谢Ben！ Youtube 我有同样的问题，这就是我在应用启动脚本中添加的内容，并且运行顺利。这是JavaScript $(document).ready(function($){ var navs = $('nav > ul.nav'); // Add class .active to current link navs.find('a').each(function(){ var cUrl = String(window.location).split('?')[0]; if (cUrl.substr(cUrl.length - 1) === '#') { cUrl = cUrl.slice(0,-1); } if ($($(this))[0].href===cUrl) { $(this).addClass('active'); $(this).parents('ul').add(this).each(function(){ $(this).parent().addClass('open'); }); } }); }); 相应的HTML如下所示。我正在使用 -coreui，这是一种惊人的开源管理模板，并为许多前端框架提供了支持，例如Angular，Plain Bootstrap，Angular 4等。 <div class="sidebar"> <nav class="sidebar-nav open" > <ul class="nav" id="navTab" role="tablist"> <li class="nav-item"> <a class="nav-link" href="/summary"><i class="icon-speedometer"></i> Dashboard </a> </li> <li class="nav-item"> <a class="nav-link" href="/balanceSheet"><i class="icon-chart"></i> Balance Sheet </a> </li> <li class="divider"></li> <li class="nav-title border-bottom"> <p class="h5 mb-0"> <i class="icon-graph"></i> Assets </p> </li> </ul> </nav> </div> 在某些罕见的引导4：4： 为了将解决方案用于相对路径，例如： <ul class="navbar-nav nav-t"> <li class="nav-item"><a href="index.php" class="nav-link">Home</a></li> <li class="nav-item"><a href="about.php" class="nav-link">About</a></li> <li class="nav-item"><a href="blog.php" class="nav-link">Blog</a></li> <li class="nav-item"><a href="info.php" class="nav-link">Info</a></li> </ul> 然后您会发现：代码： if (activePage == currentPage) { $(this).parent().addClass('active'); } 活动页面返回整个URL，当前位置返回当前的HREF DOM元素值为filename.php。 为了解决此问题，只需添加一种方法来纠正以下方法，请稍微调整代码： //... other js/jquery code var activeMenuItemChanges=function () { function stripTrailingSlash(str) { if(str.substr(-1)=='/'){ return str.substr(0, str.length -1); } return str; } // for cases where we do not use full url but relative file names in the href of ul>li>a tags: function getRelativeFileName(str){ let page=str.substr(str.lastIndexOf('/')+1); if(page.length > 0){ return page; } return 'index'|'index.php'; } let url=window.location.pathname; let activeLocation=stripTrailingSlash(url); let activeFileName=getRelativeFileName(activeLocation); $('.nav-item a').each(function() { let currentLocation=stripTrailingSlash($(this).attr('href')); if(activeFileName==currentLocation){ $(this).parent().addClass('active'); } }); } activeMenuItemChanges(); //... other js/jquery code here是完整的Twitter引导程序示例，并基于查询字符串应用了活动类。 采取措施遵循以实现正确解决方案的步骤： 1）包括最新的jquery.js和bootstrap.js javascript文件。 2）包括最新的Bootstrap.css文件 3）包括querystring-0.9.0.js，用于在js.中获取查询字符串变量值 4）html： <div class="navbar"> <div class="navbar-inner"> <div class="container"> <ul class="nav"> <li class="active"> <a href="#?page=0"> Home </a> </li> <li> <a href="#?page=1"> Forums </a> </li> <li> <a href="#?page=2"> Blog </a> </li> <li> <a href="#?page=3"> FAQ's </a> </li> <li> <a href="#?page=4"> Item </a> </li> <li> <a href="#?page=5"> Create </a> </li> </ul> </div> </div> </div> script标签中的jquery： $(function() { $(".nav li").click(function() { $(".nav li").removeClass('active'); setTimeout(function() { var page = $.QueryString("page"); $(".nav li:eq(" + page + ")").addClass("active"); }, 300); }); }); 我已经完成了bin，所以请单击此处Http：//codebins.com/bin/4ldqpaf 这些对我无效。我的Bootstrap设置导航到单独的页面（因此我无法在单击操作上执行此操作，但是在导航到新页面的导航上删除了活动类），而我的URL不完全匹配。因此，根据我的基于例外的情况，这就是我所做的。希望它能帮助他人： //Adding the active class to Twitter bootstrap navs, with a few alternate approaches $(document).ready(function() { var rawhref = window.location.href; //raw current url var newpage = ((window.location.href.match(/([^\/]*)\/?$/)[1]).substring(1)); //take only the last part of the url, and chop off the first char (substring), since the contains method below is case-sensitive. Don't need to do this if they match exactly. if (newpage == 'someNonMatchingURL') { //deal with an exception literally newpage = 'matchingNavbarText' } if (rawhref.indexOf('somePartofURL') != -1) { //look for a consistent part of the path in the raw url to deal with variable urls, etc. newpage = "moreMatchingNavbarText" } $(".nav li a:contains('" + newpage + "')").parent().addClass('active'); //add the active class. Note that the contains method requires the goofy quote syntax to insert a variable. }); 即使在URL中使用参数，也可以激活菜单和子菜单，请使用代码bellow： // Highlight the active menu $(document).ready(function () { var action = window.location.pathname.split('/')[1]; // If there's no action, highlight the first menu item if (action == "") { $('ul.nav li:first').addClass('active'); } else { // Highlight current menu $('ul.nav a[href="/' + action + '"]').parent().addClass('active'); // Highlight parent menu item $('ul.nav a[href="/' + action + '"]').parents('li').addClass('active'); } }); this接受URL，例如： /posts /posts/1 /posts/1/edit $(function() { // Highlight the active nav link. var url = window.location.pathname; var filename = url.substr(url.lastIndexOf('/') + 1); $('.navbar a[href$="' + filename + '"]').parent().addClass("active"); }）; 有关更多详细信息在这里单击！

如何控制变更事件的选择2选择？

而HTML表中的绑定数据获取NAN值

Maintenance Point

使用html表中绑定数据的jQuery获取NAN值

Maintenance Point

Tablesorter

会帮助我，但我没有任何机制来取消这种选择。

如何防止在Enter上进行NewLine输入以提交输入？

问题： 我正在尝试使用quill.js创建丰富的文本内联内容编辑元素。我很难弄清楚如何在没有...

如何删除bootstrap按钮边框？

我有一个自定义的引导按钮，单击后我无法卸下其边框。我能够改变其背景颜色，但有一个坚持的蓝色边框使我无聊。 我单击它，它打开模态

Quill.js：如何防止Newline进入输入以提交输入？

问题： 我正在尝试使用quill.js创建丰富的文本内联内容编辑元素。我很难弄清楚如何在没有...

如何控制切片和线路路径之间的差距？ 我正在尝试改变两件事： 所有单个切片之间的差距。目前，默认值对我需要的东西很大。 线路路径和切片之间的差距。我希望这行PA ...

如何使用Wheelnavjs

Bootstrap模式和MMENU菜单发生冲突

中单击按钮时会键op。

如何删除重复的选择选项，除了选择？

在某种程度上，我可以使用jQuery/javaScript删除选定选项的副本？ 我已经尝试在PHP中使用IF/其他，但这是12 f ...

在JSON.STRINGIFY输出之间空间 我正在使用jQuery从页面获取所有产品名称，而不是将其放在数组上。我正在使用此代码

<code> &lt;script type=&#34;text/javascript&#34;&gt; jQuery(document).ready(function($) { var products = $(&#34;.product-name&#34;).map(function() { return { name: $(this).text() } }) .get(); console.log(JSON.stringify(products)); }); &lt;/script&gt; </code></desc> <question vote="26">这给我以这种格式的输出 <p></p>[{“名称”：“示例产品名称”}，{“ name”：“示例产品名称2”}]<pre></pre> <p>我试图实现的是在“”之后的这两个对象之间拥有一个空间，因此输出看起来像this</p> <p><strong>[{“名称”：“示例产品名称”}，{“ name”：“示例产品名称2”}]</strong></p> <p>建议吗？我在几个小时里挣扎，没有成功。 </p> <p>在这里是JSFIDDLE <strong>Http：//jsfiddle.net/2memy/1/</strong></p> <p> </p> <p>这可能不是您想要的，但是如果您只希望它看起来更好，我建议：<a href="http://jsfiddle.net/2MeMY/1/" rel="noreferrer"> </a><code>console.log(JSON.stringify(products, null, 2)); </code></p> </question>那会给你<answer tick="true" vote="42"> <p><code>[ { &#34;name&#34;: &#34;Sample Product Name&#34; }, { &#34;name&#34;: &#34;Sample Product Name 2&#34; } ] </code></p> <pre>在控制台中。 如果您真的只想要逗号之前的空间，可以这样做：</pre> <p><code>console.log(JSON.stringify(products).split(&#39;},{&#39;).join(&#39;}, {&#39;)); </code></p> <pre></pre>Http：//jsfiddle.net/2memy/3/<p></p> <pre> </pre> <p>如果您想要一个：<a href="http://jsfiddle.net/2MeMY/3/"> </a> single-line</p> prop-name和prop-values之间的空间（以及项目之间）</answer> 每个逗号与下一个propname/item<answer tick="false" vote="4">之间的空格 <p> 您可以使用以下方式： </p><ol> <li> </li><code>function Stringify_WithSpaces(obj) { let result = JSON.stringify(obj, null, 1); // stringify, with line-breaks and indents result = result.replace(/^ +/gm, &#34; &#34;); // remove all but the first space for each line result = result.replace(/\n/g, &#34;&#34;); // remove line-breaks result = result.replace(/{ /g, &#34;{&#34;).replace(/ }/g, &#34;}&#34;); // remove spaces between object-braces and first/last props result = result.replace(/\[ /g, &#34;[&#34;).replace(/ \]/g, &#34;]&#34;); // remove spaces between array-brackets and first/last items return result; } let obj = [{name: &#34;Sample Product Name&#34;}, {name: &#34;Sample Product Name 2&#34;}]; console.log(&#34;Stringified with spaces: &#34; + Stringify_WithSpaces(obj));</code><li> </li> <li> </li></ol> <p>这是单行表达式的函数：</p> <div data-babel="false" data-lang="js" data-hide="false" data-console="true"><code>JSON.stringify(obj, null, 1).replace(/^ +/gm, &#34; &#34;).replace(/\n/g, &#34;&#34;).replace(/{ /g, &#34;{&#34;).replace(/ }/g, &#34;}&#34;).replace(/\[ /g, &#34;[&#34;).replace(/ \]/g, &#34;]&#34;) </code><div> <pre></pre>延伸的打字稿版本</div></div> <p> there是一个更详细的版本（在打字稿中），带有选项：</p> <p><code>export class ToJSON_WithSpaces_Options { insideObjectBraces = false; insideArrayBrackets = false; betweenPropsOrItems = true; betweenPropNameAndValue = true; } export function ToJSON_WithSpaces(obj, options?: Partial&lt;ToJSON_WithSpaces_Options&gt;) { options = Object.assign({}, new ToJSON_WithSpaces_Options(), options); let result = JSON.stringify(obj, null, 1); // stringify, with line-breaks and indents result = result.replace(/^ +/gm, &#34; &#34;); // remove all but the first space for each line result = result.replace(/\n/g, &#34;&#34;); // remove line-breaks if (!options.insideObjectBraces) result = result.replace(/{ /g, &#34;{&#34;).replace(/ }/g, &#34;}&#34;); if (!options.insideArrayBrackets) result = result.replace(/\[ /g, &#34;[&#34;).replace(/ \]/g, &#34;]&#34;); if (!options.betweenPropsOrItems) result = result.replace(/, /g, &#34;,&#34;); if (!options.betweenPropNameAndValue) result = result.replace(/&#34;: /g, `&#34;:`); return result; } </code></p> chistly，这种功能将应用常规表达式<pre>Prior</pre>来删除线路断开（以便它可以保证它不会在用户供给的字符串中修改文本），但是我会为其他人留下来，因为上面足以容纳我的用例（并且我认为大多数其他）。 <h3> <strong> 您也可以像更换一样这样。 </strong><code>console.log(JSON.stringify(products).replace(/},{/g,&#39;}, {&#39;)); // /},{/g means all occurance of },{ </code></h3> <hr/> <p> </p>接受的答案没有回答这个问题，第二个额定答案是错误的：<pre> </pre><code>console.log(Stringify_WithSpaces({ inner: &#39;{ [ ] }&#39; })) // {&#34;name&#34;: &#34;{[]}&#34;} </code><p> <em>您需要做的是最初带有一个永远不会出现在RAW JSON字符串中的字符（例如RAW选项卡），然后确保每个替换只有在存在此类字符（Tabs，Newlines）时才能匹配。 </em></p></answer> <answer tick="false" vote="1"> <p><code>function stringify(obj, options) { const { padBraces, padBrackets } = { padBraces: true, padBrackets: false, ...options } const braces = padBraces ? [&#39;{ &#39;, &#39; }&#39;] : [&#39;{&#39;, &#39;}&#39;] const brackets = padBrackets ? [&#39;[ &#39;, &#39; ]&#39;] : [&#39;[&#39;, &#39;]&#39;] return JSON.stringify(obj, null, &#39;\t&#39;) .replaceAll(/\{[\t\n]+/g, braces[0]) .replaceAll(/[\t\n]+\}/g, braces[1]) .replaceAll(/\[[\t\n]+/g, brackets[0]) .replaceAll(/[\t\n]+\]/g, brackets[1]) .replaceAll(/[\t\n]+/g, &#39; &#39;) } const obj = { config: [{ inner: &#39;{ [ ] }&#39;, options: { size: 6 } }] } console.log(&#39;normal:&#39;, stringify(obj)) console.log(&#39;narrow:&#39;, stringify(obj, { padBraces: false })) console.log(&#39;wide: &#39;, stringify(obj, { padBrackets: true }))</code></p> <pre> </pre> </answer><answer tick="false" vote="0"> <p> </p><pre>

我有一个html的bootstrap 5下拉列表：

我有一个html：我有一个bootstrap 5下拉列表。 <div class="dropdown"> <p class="dropdown-toggle" data-bs-toggle="dropdown">Your company</p> <ul class="dropdown-menu"> <li id="name">Company Name</li> .. <li id="email">Email<span class="fail">✗</span></li> </ul> </div> 在下拉列表的位置有所不同，具体取决于我是通过编程或单击箭头打开的。 在单击箭头时，左图是下拉式。正确的图像是使用此代码编程打开时的下拉式： $('#email').parent().show(); 为什么在程序上打开时的位置较低？ 使用$('#email').parent().show()仅设置display: block显示该元素，该元素仍然遵守标准框型号（边距，填充，边框...）。如有记录，您应通过以下方式编程地控制下拉组件： const dropdownIns = new bootstrap.Dropdown($('.dropdown-toggle')); dropdownIns .show();

如何使用jQuery检查字符串中的第一个数字是“ 0”？ 我正在尝试使用jQuery创建一个简单的计算器。 我有一个我用作显示的段落标签。按下“ AC”按钮清除我的显示按钮后，段落标签包含“ 0”。 我

javascript：如何判断ajax响应是否为json

但是，获得的返回可能不是JSON，而是HTML错误页面（不幸的是，响应类型200）。

jquery nth-child（n）无法正常工作

我想在列表中的第四张图像上更改边缘权利。 <div class="moduletable_lbx"> <div class="custom_lbx" > <p> <a title="" href="/images/lyndonosborn/columbia-lbx/columbia-Road-001.jpg" data-lightbox="group:columbia-Road;titlePosition:over;transitionIn:elastic; "><img src="/images/lyndonosborn/columbia-lbx/columbia-Road-001-thumb.jpg" alt="" /></a> <a title="" href="/images/lyndonosborn/columbia-lbx/columbia-Road-002.jpg" data-lightbox="group:columbia-Road;titlePosition:over;transitionIn:elastic; "><img src="/images/lyndonosborn/columbia-lbx/columbia-Road-002-thumb.jpg" alt="" /></a> <a title="" href="/images/lyndonosborn/columbia-lbx/columbia-Road-003.jpg" data-lightbox="group:columbia-Road;titlePosition:over;transitionIn:elastic; "><img src="/images/lyndonosborn/columbia-lbx/columbia-Road-003-thumb.jpg" alt="" /></a> <a title="" href="/images/lyndonosborn/columbia-lbx/columbia-Road-004.jpg" data-lightbox="group:columbia-Road;titlePosition:over;transitionIn:elastic; "><img src="/images/lyndonosborn/columbia-lbx/columbia-Road-004-thumb.jpg" alt="" /></a> <a title="" href="/images/lyndonosborn/columbia-lbx/columbia-Road-005.jpg" data-lightbox="group:columbia-Road;titlePosition:over;transitionIn:elastic; "><img src="/images/lyndonosborn/columbia-lbx/columbia-Road-005-thumb.jpg" alt="" /></a> 我创建了一个小jQuery： jQuery(".moduletable_lbx img:nth-child(4) ").css( "margin-right","0px"); 但它行不通。我注意到，如果我将1个而不是4放置，那么所有正确的边距都会删除。如果我放2个，则不会删除边距。 您必须将其更改为： jQuery(".moduletable_lbx a:nth-child(4) img ").css( "margin-right","0px"); jQuery(".moduletable_lbx a:nth-child(4) img ").css("margin-right", "0px"); <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> <div class="moduletable_lbx"> <a title="" href="/images/lyndonosborn/columbia-lbx/columbia-Road-002.jpg" data-lightbox="group:columbia-Road;titlePosition:over;transitionIn:elastic; "><img src="/images/lyndonosborn/columbia-lbx/columbia-Road-002-thumb.jpg" alt="" /></a> <a title="" href="/images/lyndonosborn/columbia-lbx/columbia-Road-003.jpg" data-lightbox="group:columbia-Road;titlePosition:over;transitionIn:elastic; "><img src="/images/lyndonosborn/columbia-lbx/columbia-Road-003-thumb.jpg" alt="" /></a> <a title="" href="/images/lyndonosborn/columbia-lbx/columbia-Road-004.jpg" data-lightbox="group:columbia-Road;titlePosition:over;transitionIn:elastic; "><img src="/images/lyndonosborn/columbia-lbx/columbia-Road-004-thumb.jpg" alt="" /></a> <a title="" href="/images/lyndonosborn/columbia-lbx/columbia-Road-005.jpg" data-lightbox="group:columbia-Road;titlePosition:over;transitionIn:elastic; "><img src="/images/lyndonosborn/columbia-lbx/columbia-Road-005-thumb.jpg" alt="" /></a> </div> 您必须获取容器的4N元素，然后img. jQuery(".moduletable_lbx a:nth-child(4n) img").css( "margin-right","0px"); 我认为应该是： jQuery(".moduletable_lbx:nth-child(4) img:nth-child(1)").css( "margin-right","0px"); 因此，您应该在末尾选择父索引，img始终是第一个。 使用：eq（）的替代方法，该方法应用了0基于0的索引；通过索引检索第四元素：0,1,2，3。 3选择器应用1个基于1个索引：1,2,3，4 ：nth-child（）selector 由于jQuery的实现：nth-selectors是严格派发的 从CSS规范中，n的值是“ 1个索引”的，含义 计数从1开始。对于其他选择器表达式，例如 ：eq（）或：甚至jQuery都遵循JavaScript的“ 0索引”计数。给出 一个包含两个nth-的单个，$（“ li：nth-child（1）”）选择 第一个<li>，而选择第二个。 <li> $( "li:eq(1)" ) jQuery(".moduletable_lbx img:eq(3)").css( "margin-right","0px") jQuery(".moduletable_lbx img:eq(3)").css("margin-right", "0px") 感谢所有 - 我和一起去了 img { margin-right:24px; } 效果很好。