jquery 相关问题

如果 href 属性没有值，我想删除父级

如果 href 属性没有值，我试图删除父 div。这是我尝试过的代码，你能告诉我我做错了什么吗？ $("#cs-gallery .et_pb_module_inner .

仅当文本区域为空时才添加值

我正在 WordPress 中构建一个表单，其中包含一个文本区域，该文本区域可能有值也可能没有值，具体取决于客户的输入。为了方便客户，我重新调整了复选框的用途，以动态地

如何在jQuery中获取选中复选框的值

我有一个过滤功能，用户可以检查一个或多个设施并获取将使用 AJAX 发送到数据库的值。 在这种情况下，单击一个复选框后我还想...

如何只显示数字而不是选择的全部选中

我正在使用选定的下拉菜单插件，它的效果非常好，我面临的唯一一个问题是它通过多重选择增加高度 这是插件 https://harvesthq.github.io/chosen/ 我正在使用选定的下拉菜单插件，它的效果非常好，我面临的唯一一个问题是它通过多项选择增加高度 这是插件https://harvesthq.github.io/chosen/ <select data-placeholder="Choose a country..." multiple class="chosen-select"> $(".chosen-select").chosen(); 当我们选择多个选项时，它显示如下 这样显示 但我也希望它像这样显示所选选项的数量 谢谢你 所选 js 没有可用的默认方法。 $(document).ready(function(){ $(".chosen-select").chosen(); _setFilter(); $('.chosen-select').on('chosen:showing_dropdown', function(evt, params) { _resetFilter() }); $('.chosen-select').on('chosen:hiding_dropdown', function(evt, params) { _setFilter(); }); }); function _resetFilter() { $('.count_option').hide(); $('.search-field').show(); $('.search-choice').show(); _updateCount(); } function _setFilter() { if($('.count_option').length < 1) { $('.chosen-choices').append('<li class="count_option">States<span>0</span></li>'); } $('.count_option').show(); $('.search-field').hide(); $('.search-choice').hide(); _updateCount(); } function _updateCount() { var count = $(".chosen-select :selected").length; $('.count_option span').html('('+count+')'); } .chosen-choices, .count_option{ width: 300px !important; } <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.8.7/chosen.jquery.min.js"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.8.7/chosen.css" /> <select data-placeholder="Choose a country..." multiple class="chosen-select"> <option>Option 1</option> <option>Option 2</option> <option>Option 3</option> </select>

bootstrap 5 表单验证不适用于 textarea 模式属性？

我对我的表单使用了 bootstrap 5 表单验证方法。 https://www.w3schools.com/bootstrap5/bootstrap_form_validation.php 我尝试过使用输入元素的模式属性 我对我的表单使用了 Bootstrap 5 表单验证方法。 https://www.w3schools.com/bootstrap5/bootstrap_form_validation.php 我尝试过使用输入元素的模式属性 <div class="row"> <input type="text" class="form-control" id="abc_input" name="abc_input" required="" autocomplete="off" pattern=".*\S+.*"> <div class="invalid-feedback">Please provide a valid input value</div> <div class="valid-feedback">Looks good!</div> </div> 在上面的示例代码中，我尝试对必填字段和模式属性检查“仅不允许空格”。如果我跳过模式属性，则输入字段允许填充空白字符，这违反了我们所需的字段规则。 我也尝试申请textarea，但模式属性被浏览器忽略，因此bootstrap 5验证也无法正常工作。 <div class="row"> <textarea class="form-control" id="abc_textarea" name="abc_textarea" required="" autocomplete="off" pattern=".*\S+.*"> <div class="invalid-feedback">Please provide a valid value</div> <div class="valid-feedback">Looks good!</div> </div> 如果有人建议我验证textarea，这将对我有很大帮助。 我发现代码片段中缺少关闭</textarea>。 <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script> <div class="container mt-3"> <form method="POST" class="was-validated"> <div class="row"> <input type="text" class="form-control" id="abc_input" name="abc_input" required="" autocomplete="off" pattern=".*\S+.*"> <div class="invalid-feedback">Please provide a valid input value</div> <div class="valid-feedback">Looks good!</div> </div> <div class="row"> <textarea class="form-control" id="abc_textarea" name="abc_textarea" required="" autocomplete="off" pattern=".*\S+.*"></textarea> <div class="invalid-feedback">Please provide a valid value</div> <div class="valid-feedback">Looks good!</div> </div> </form> </div> 正如Matthew所说，TextArea字段不能使用pattern属性。 在这里查看 Yann Dìnendal 的解决方案：（如果您喜欢，请投票！） 问题：如何验证文本区域中的模式匹配？ 这可能是你能得到的最接近的..但是！-在加号上：至少它是一个可以在其他地方使用的通用函数

从一个盒子创建多个盒子

我正在尝试从一个盒子创建多个盒子。但我是 HTML 新手，不知道该怎么做。 我需要什么： 我需要一盒；单击它，将创建两个新框，下一次将创建四个框...

如何在上下移动元素后保留新行

在下面的示例中单击 dolor，使其变为活动状态 然后点击按钮 - 多洛就会向上移动 但在生成的 html 中 - 新行丢失 $(document).on('click', '.ati', functio...

查找文本包含列表/数组中的条目的元素

我正在开发一个自定义用户脚本，它将阻止/标记我的列表中的用户。假设该列表将包含字符串“EvilJoe”、“ToxicWill”和“NegativeSara”。我想...

jQuery 无法通过属性名称选择元素并获取节点名称

我尝试通过属性名称选择此元素并打印节点名称，但结果未定义。 第一个警报有效，但第二个警报无效。 HTML 代码： 我尝试通过属性名称选择此元素并打印节点名称，但结果未定义。 第一个警报有效，但第二个警报不起作用。 HTML代码： <objeto bordeactivo type="image"> <img src="https://picsum.photos/536/354"/> </objeto> jQuery 代码： var ob = $("[bordeactivo]"); var ob2 = ob.find("img"); // Works! alert("ob>"+ob.attr("type")); // NOT WORKING! alert("nodeName>"+ob2.nodeName); 有什么问题吗？ 我的JsFiddle： jsfiddle 代码示例 通过使用 ob2.prop("nodeName")，您可以访问底层 <img> 元素的 DOM 属性 nodeName 并将其显示在警报框中。 var ob = $("[bordeactivo]"); var ob2 = ob.find("img"); // Works console.log("ob>" + ob.attr("type")); // Updated code console.log("nodeName>" + ob2.prop("nodeName")); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <objeto bordeactivo type="image"> <img src="https://picsum.photos/536/354" /> </objeto>

Bootstrap 4 中未显示数据表按钮

我正在使用 Bootstrap 4 的数据表，我想使用按钮扩展来导出表数据。但是，按钮没有显示在页面上，并且控制台中没有错误。 ...

带有 jQuery $('CLASS').on('click tap touchstart', function(event) 的 HTML 按钮在移动设备上不起作用 (Wordpress BricksBuilder)

我已经使用一些建议编辑了上次发布此问题的代码，不幸的是我链接到的“重复”也没有解决问题。这是我正在使用的代码：...

如何在单击锚点时更改工具提示？

我正在开发一种设计，用户可以单击 Glyphicon 锚点，它将文本复制到剪贴板。我希望单击按钮时工具提示会发生变化。所以当它们悬停在...

如何让图像在其容器内生长以创建缩放效果？

http://darrenbachan.com/ 我试图让它当我将鼠标悬停在项目上时 img 放大。我尝试使用这个： .grow { 过渡：所有 .2 秒的缓入缓出； } .grow:hover { 变换:缩放(1....

未捕获类型错误：在未实现 URLSearchParams 接口的对象上调用“append”

我正在尝试制作一个具有分页功能的php页面，首先提交一个表单，然后使用页面点击功能更新该区域。将提交的表格如下： 我正在尝试通过首先提交表单然后使用页面点击功能更新区域来制作一个具有分页功能的php页面。将提交的表格如下： <form class="row g-3" name="search" id="search" method="POST" action=""> <div class="row g-3 align-items-center"> <div class="col-sm-3"><label for="departmentSer" class="col-form-label">Select Department:</label></div> <div class="col-sm-8"> <select class="form-select" name="departmentSer" id="departmentSer" aria-label="Default select example"> <option>Choose1</option> <option>Choose2</option> <option>Choose3</option> </select> </div> <div class="col-sm-3"> <button type="submit" class="btn btn-primary" id="lddeptSecSub" name="lddeptSecSub" value="lddeptSearch" onclick="submitFormSea(this.value, 'departmentSer')">Get List</button> </div> </div> </form> 以下是将更新 ajax 查询结果的 HTML 区域： <div class="align-items-center mt-4" id="formShowData" name="formShowData"> </div> </div> 分页链接是这样生成的： <a class="page-link" href="?areac=lddeptSearch&amp;place=Choose...&amp;dsource=listData&amp;page=1" onclick="submitClick(this)">1</a> 此区域首先通过表单提交进行更新。然后在单击页面时进行替换。下面的 jQuery 正在执行该功能： function jajax_qview(datas, field) { var request = $.ajax({ url: "ajax_areac.php", method: "POST", data: datas, cache: false, dataType: "html", }); request.done(function( msg ) { $('#'+field).html(msg); }); request.fail(function( jqXHR, textStatus ) { console.log(datas); alert( "Request failed: " + textStatus ); }); request.always(function() { datas = undefined; }); } function submitForm(formNameS, elemIdVal) { event.preventDefault(); var datas = {areac:formNameS, place : $('#'+elemIdVal).val()}; jajax_qview(datas, 'formS'); } function submitClick(submitLinkVars) { event.preventDefault(); var searchParams = new URLSearchParams(submitLinkVars.search); var datas = searchParams; jajax_qview(datas, 'formS'); } 现在的问题是，“submitForm”函数工作得很好，提交时生成所需的数据，没有任何错误。但是，当单击页码时，会提交函数submitClick，但我收到错误“未捕获的类型错误：在未实现接口 URLSearchParams 的对象上调用了‘append’”。 函数“submitClick”生成的变量datas是URLSearchParams(4) { areac → "lddeptSearch", place → "7", dsource → "listData", page → "2" } 我尝试过使用ajax参数processData: false,contentType: false,。尝试使用此选项时，ajax 方法不会将任何数据提交到 php 文件。当尝试使用 dataType: "json" 时，我收到错误 Request failed: parsererror。 那么，如何解决点击页面链接时提交数据的问题 jQuery 的 $.ajax 函数不接受 URLSearchParams 对象作为 data 选项的输入，这就是错误的根源。根据 $.ajax 文档，data 可以是普通对象、字符串或数组。 $.ajax文档声明它将接受类似URL的查询字符串作为输入（根据标准application/x-www-form-urlencoded内容类型）： 当数据作为字符串传递时，它应该已经使用 contentType 的正确编码进行编码，默认情况下为 application/x-www-form-urlencoded。 对于您的情况，最简单的事情可能是使用 URLSearchParams 对象的 toString() 函数 以该格式输出参数。 URLSearchParamstoString文档指出： URLSearchParams接口的toString()方法返回一个查询 适合在 URL 中使用的字符串。 所以请尝试这个： var searchParams = new URLSearchParams(submitLinkVars.search); var datas = searchParams.toString(); jajax_qview(datas, 'formS');

使用jquery根据索引位置隐藏元素

我有一个包含许多列和行的动态表。在某些单元格中，有特定值“N/A”。 我也想隐藏包含“N/A”的单元格及其表格标题 怎么样

如何查找以下 HTML 元素

我有一个带有子菜单的菜单，其结构如下： 菜单项 1 我有一个带有子菜单的菜单，其结构如下： <ul> <li> <a class="navigation-item">Menu Item 1</a> <a class="submenu-toggle" /> <ul class="submenu"> <li> <a class="navigation-item">Submenu Item 1</a> </li> </ul> </li> </ul> 如果选择了子菜单项 1，我想向子菜单切换添加一个类。在这种情况下我怎样才能找到子菜单切换？ closest('li')不起作用，这只会找到子菜单后面的li。 closest('li > .submenu-toggle') 也不起作用，因为 .submenu-toggle 必须是子菜单项的祖先。如果我可以选择正确的 li，我就可以使用 find('.submenu-toggle')。但如何选择正确的li呢？ 要实现此目的，您可以遍历 DOM 以查找包含 li 的正确 submenu-toggle 元素 以及所选的子菜单项。 $(document).ready(function() { // Assuming 'Submenu Item 1' is selected $('.submenu .navigation-item').on('click', function() { // Find the closest 'li' ancestor that contains the submenu var parentLi = $(this).closest('ul.submenu').parent('li'); // Find the 'submenu-toggle' within that 'li' var submenuToggle = parentLi.find('.submenu-toggle'); // Add the desired class to the 'submenu-toggle' submenuToggle.addClass('active'); }); });

在 Woocommerce 的单个产品页面中添加产品注释字段

我想在单个产品详细信息页面中为用户创建自定义订单注释。这个可以使用 php 来完成，无需插件。我已附上屏幕截图和网站 URL 以供参考。 他们已经尝试过这个c...

不确定我是否收到 javascript 或 jquery 错误

我有下面的jquery代码。 jquery 不工作吗？我在 javascript 中有两个警报框，但第二个警报框不显示，第一个警报框显示。没有控制台错误。 函数 validateForm(){ ...

Wordpress 和 jquery 自动完成元键

我一直在尝试在我的 WordPress 中添加自动完成功能，但没有成功。 在我的functions.php中： // 加载具有自动完成功能的文件 wp_register_script( 'jquery-ui', get_template_directory_uri() . '/js/

如何在touchy上旋转拇指？

如何添加对移动设备的支持（可能是任何 jquery 滑动或任何其他方式）？ 这是我的小提琴 拇指旋转工作正常，唯一的问题是在移动设备中我必须单击才能旋转，但是