jquery 相关问题

jQuery是一个Javascript库,考虑添加Javascript标记。 jQuery是一个流行的跨浏览器JavaScript库,它通过最小化浏览器之间的差异来促进文档对象模型(DOM)遍历,事件处理,动画和AJAX交互。标记为jquery的问题应该与jquery相关,因此有问题的代码应该使用jquery,并且至少需要jquery与用法相关的元素。

通过在页面上滚动来移动滚动条

看一下下面的代码: 函数 getScrollPercent() { const h = document.documentElement; const st = '滚动顶部'; const sh = '滚动高度'; ...

回答 1 投票 0

PHP 执行时显示加载图像

我想在 php 脚本执行时显示加载图像。我读过关于如何做到这一点的不同答案,但大多数人都说我应该有一个单独的 php 页面。但我就是我们...

回答 3 投票 0

{point.name] 在渲染之前查找并替换名称中的字符串

我有这个代码: 工具提示:{ 使用HTML:true, pointFormat: '{point.name}: {point.value}' }, 我想更换一个...

回答 1 投票 0

如何在另一个 html 页面中打开一个 html 页面作为弹出窗口

我是 JavaScript 新手。现在我的主页中有一个重定向到其他 html 页面的链接,但我想在我的主页中显示一个具有响应能力的弹出窗口,并且某些样式(例如角)是...

回答 2 投票 0

使用javascript将图像显示到html页面

我的目的是使用javascript在html页面上显示图像,该图像位于文件夹中,图像id存储在表中但没有显示,如下所示 $(文档).ready(函数(e) { 变量 ID =...

回答 1 投票 0

使用从 JSON 配置中提取的 jQuery 选择器时出错

我有一个 JSON 对象,其中包含 jQuery 选择器和值。选择器内的特殊字符(我认为)已被正确转义。 JSON 如下所示: 变量配置= [{ &

回答 1 投票 0

JQuery 文本区域字符计数

我正在尝试使用 Jquery 来计算文本区域中的字符,这是我到目前为止所拥有的.. <p>我正在尝试使用 Jquery 来计算文本区域中的字符数,这是我到目前为止所拥有的..</p> <pre><code>&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;&lt;/title&gt; &lt;script src=&#34;https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js&#34;&gt;&lt;/script&gt; &lt;script type=&#34;text/javascript&#34;&gt; $(document).ready(function() { $(&#34;#textfield&#34;).on(&#39;keyup, paste&#39;, function(){ var Characters = (&#34;#textfield&#34;).val().replace(/(&lt;([^&gt;]+)&gt;)/ig,&#34;&#34;).length; $(&#34;#counter&#34;).text(&#34;Characters left: &#34; + (1500 - Characters)); }); }); &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;form id=&#34;input_form&#34; method=&#34;POST&#34; action=&#34;?&#34;&gt; &lt;textarea id=&#34;textfield&#34;&gt;&lt;/textarea&gt; &lt;/form&gt; &lt;div id=&#34;counter&#34;&gt;&lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>我的 div 中没有输出任何内容...有什么想法吗?</p> </question> <answer tick="false" vote="2"> <p>您的代码中有两个问题</p> <p>1)将事件列表/多个事件传递给 on 方法时不需要逗号。应该是<pre><code>.on(&#39;keyup paste&#39;</code></pre></p> <p>2)在获取textarea的文本值时缺少jquery选择器。你应该使用</p> <pre><code> $(&#34;#textfield&#34;).on(&#39;keyup, paste&#39;, function(){ var Characters = $(&#34;#textfield&#34;).val().replace(/(&lt;([^&gt;]+)&gt;)/ig,&#34;&#34;).length; $(&#34;#counter&#34;).text(&#34;Characters left: &#34; + (1500 - Characters)); }); </code></pre> <p><strong><a href="https://jsfiddle.net/rv3zcwur/" rel="nofollow">工作演示</a></strong></p> </answer> <answer tick="true" vote="1"> <p>有两个问题:</p> <ol> <li><pre><code>.on(&#39;keyup paste&#39;</code></pre>删除此处的逗号</li> 选择器中缺少 <li><pre><code>$(&#34;#textfield&#34;).val().replace</code></pre> 这里 <pre><code>$</code></pre>。</li> </ol> <p></p><div data-hide="false" data-lang="js"> <div> <pre><code> $(document).ready(function() { $(&#34;#textfield&#34;).on(&#39;keyup paste&#39;, function(){ // &lt;---remove &#39;,&#39; comma var Characters = $(&#34;#textfield&#34;).val().replace(/(&lt;([^&gt;]+)&gt;)/ig,&#34;&#34;).length; // &#39;$&#39; is missing from the selector $(&#34;#counter&#34;).text(&#34;Characters left: &#34; + (1500 - Characters)); }); });</code></pre> <pre><code>&lt;script src=&#34;https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js&#34;&gt;&lt;/script&gt; &lt;form id=&#34;input_form&#34; method=&#34;POST&#34; action=&#34;?&#34;&gt; &lt;textarea id=&#34;textfield&#34;&gt;&lt;/textarea&gt; &lt;/form&gt; &lt;div id=&#34;counter&#34;&gt;&lt;/div&gt;</code></pre> </div> </div> <p></p> </answer> <answer tick="false" vote="0"> <p>除了上面的 jquery 代码之外,还需要在下面的代码中添加 <strong>maxlenth</strong> 为 1500,以便将字符限制为 1500。</p> <pre><code>&lt;textarea id=&#34;textfield&#34; maxlength=&#34;1500&#34;&gt;&lt;/textarea&gt; </code></pre> </answer> </body></html>

回答 0 投票 0

通过jquery $.post上传文件

为了发送ajax表单,我使用以下代码: 注意:不使用“FORM”标签 我的 jQuery 代码: var file = $('#file').val(); $.post('form.php', {file:file},

回答 3 投票 0

输入事件对于输入标签(输入标签位于 summornote 编辑器中)无法正常工作

在此输入图像描述 这是 SummerNote 和 SummerNote 编辑器输入,但是当我在输入标记中插入值然后调用输入事件来填充输入值属性时,现在我的问题是...

回答 1 投票 0

使用 jQuery 在文本区域中向下滚动

问候 你好 测试 再见 &...</desc> <question vote="37"> <pre><code><h2>Greetings</h2> <div class="container"> <div class="inner"> Hello <p>Test</p> </div> <textarea id="one" class="inner"> Goodbye </textarea> </div> $("#one").append("your text to append"); $("#one").append("your text to append"); $("#one").append("your text to append"); $("#one").append("your text to append"); </code></pre> <p>直播:<a href="http://jsfiddle.net/tGFmq/" rel="noreferrer">http://jsfiddle.net/tGFmq/</a></p> <p>我怎样才能让这个文本区域自动向下滚动?</p> </question> <answer tick="true" vote="70"> <p>将此位添加到您的代码中(最好是在您拥有的任何插入的末尾):</p> <pre><code> var psconsole = $('#one'); if(psconsole.length) psconsole.scrollTop(psconsole[0].scrollHeight - psconsole.height()); </code></pre> </answer> <answer tick="false" vote="11"> <p>观看此现场演示:<a href="http://jsfiddle.net/DerekL/tGFmq/1/" rel="nofollow"><strong><pre><code>here</code></pre></strong></a></p> <p>要计算底部<pre><code>scrollTop</code></pre>,您只需从<em><code>height</code></em>中<pre>减去</pre><pre><code>scrollHeight</code></pre>即可:</p> <pre><code>var oneDiv = $("#one"); bottom = oneDiv.prop('scrollHeight') - oneDiv.height() </code></pre> <p>然后你可以将其scrollTop设置为<pre><code>bottom</code></pre>,或者使用令人惊叹的<a href="http://api.jquery.com/animate/" rel="nofollow"><strong>jQuery的<em><pre><code>animate()</code></pre></em></strong></a>来制作很酷的动画。</p> <p>现场演示:<a href="http://jsfiddle.net/DerekL/tGFmq/1/" rel="nofollow"><strong><pre><code>here</code></pre></strong></a></p> </answer> <answer tick="false" vote="4"> <p>我意识到我的问题是我的代码位于错误的位置。 -> 放在元素下并解决问题(菜鸟错误....) -- 只是给大家一个提醒。</p> </answer> <answer tick="false" vote="0"> <pre><code><body> <textarea id="textarea-1" onfocus="setCss(this)" type="text" name="" autofocus>demo</textarea><br/> <button class="btn" onclick="setCss()">定位光标</button> </body> <script> function setCss(opt) { var sr = document.getElementById("textarea-1"); sr.scrollTop = sr.scrollHeight; // 内容滚动到最后一行 var len = sr.value.length; setSelectionRange(sr, len, len); //将光标定位到文本最后 } function setSelectionRange(input, selectionStart, selectionEnd) { if (input.setSelectionRange) { input.focus(); input.setSelectionRange(selectionStart, selectionEnd); } else if (input.createTextRange) { var range = input.createTextRange(); range.collapse(true); range.moveEnd('character', selectionEnd); range.moveStart('character', selectionStart); range.select(); } } </script> </body> </code></pre> </answer> </body></html>

回答 0 投票 0

在 Chrome 中使用本地文件的 jQuery getJSON 问题

我有一个非常简单的测试页面,它使用带有 jQuery 的 $.getJSON 和 $.ajax 方法的 XHR 请求。同一页面在某些情况下有效,但在其他情况下则无效。具体来说,它在 Chrome 中不起作用...

回答 7 投票 0

用于输入中文的 JQuery/DOM 事件(ibus)?

我们知道,当我们打字时,会触发很多事件。 例如 keyup、keydown、keypress 或其他。 有没有其他事件只有当t中的内容时才会触发...

回答 3 投票 0

bassistance jquery 验证插件出现问题,表单无效时提交

我似乎找不到任何评论我在尝试使用 bassistance jquery 验证插件时的行为。 我在 VB.net 工作(我知道,我知道) 反正我有几个

回答 1 投票 0

使用 jQuery:在单击按钮时将输入添加到列表

此代码设置了一个简单的待办事项列表界面,其中包含一个用于添加新待办事项的输入框和一个用于提交它们的按钮。它使用 jQuery 来处理 DOM 操作和事件处理。 renderTodos 函数...

回答 1 投票 0

如何验证引导程序中的密码字段?

我正在使用 bootstrap 在 asp.net 中工作。我想验证密码字段。当用户单击密码字段时,我的代码显示信息框。 需要密码... 我正在使用 bootstrap 在 asp.net 中工作。我想验证密码字段。当用户单击密码字段时,我的代码显示信息框。 <div id="pswd_info"> <h4>Password requirements:</h4> <ul> <li id="letter" class="invalid fa-warning"> At least <strong>one letter</strong></li> <li id="capital" class="invalid"> At least <strong>one capital letter</strong></li> <li id="number" class="invalid"> At least <strong>one number</strong></li> <li id="special" class="invalid"> At least <strong>one special character</strong></li> <li id="length" class="invalid"> Be at least <strong>8 characters</strong></li> </ul> </div> javascript <!-- password info box--> <script> $(document).ready(function () { $('#password').keyup(function () { // set password variable var pswd = $(this).val(); //validate the length if (pswd.length < 8) { $('#length').removeClass('valid').addClass('invalid'); } else { $('#length').removeClass('invalid').addClass('valid'); } //validate letter if (pswd.match(/[A-z]/)) { $('#letter').removeClass('invalid').addClass('valid'); } else { $('#letter').removeClass('valid').addClass('invalid'); } //validate capital letter if (pswd.match(/[A-Z]/)) { $('#capital').removeClass('invalid').addClass('valid'); } else { $('#capital').removeClass('valid').addClass('invalid'); } //validate number if (pswd.match(/\d/)) { $('#number').removeClass('invalid').addClass('valid'); } else { $('#number').removeClass('valid').addClass('invalid'); } //validate special character if (pswd.match(/[!@#$ %^&*]/)){ $('#special').removeClass('invalid').addClass('valid'); } else { $('#special').removeClass('valid').addClass('invalid'); } }); $('#password').focus(function () { $('#pswd_info').show(); }); $('#password').blur(function () { $('#pswd_info').hide(); }); }); </script> 上面的代码只是显示信息框并根据用户输入更改每个 li。但是,仍然接受任何不符合标准的密码。如何验证#password 字段?我已经有了下面的脚本来验证其他字段 JavaScript <script> // initialize the validator function validator.message.date = 'not a real date'; // validate a field on "blur" event, a 'select' on 'change' event & a '.reuired' classed multifield on 'keyup': $('form') .on('blur', 'input[required], input.optional, select.required', validator.checkField) .on('change', 'select.required', validator.checkField) .on('keypress', 'input[required][pattern]', validator.keypress); $('.multi.required').on('keyup blur', 'input', function() { validator.checkField.apply($(this).siblings().last()[0]); }); $('form').submit(function(e) { e.preventDefault(); var submit = true; // evaluate the form using generic validaing if (!validator.checkAll($(this))) { submit = false; } if (submit) this.submit(); return false; }); </script> 最少八个字符,至少一个字母和一个数字: "^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{8,}$" 最少八个字符,至少一个字母、一个数字和一个特殊字符: "^(?=.*[A-Za-z])(?=.*\d)(?=.*[$@$!%*#?&])[A-Za-z\d$@$!%*#?&]{8,}$" 最少八个字符,至少一个大写字母,一个小写字母和一个数字: "^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[a-zA-Z\d]{8,}$" 最少 8 个字符,至少 1 个大写字母、1 个小写字母、1 个数字和 1 个特殊字符: "^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[$@$!%*?&])[A-Za-z\d$@$!%*?&]{8,}" 最少 8 个、最多 10 个字符,至少 1 个大写字母、1 个小写字母、1 个数字和 1 个特殊字符: "^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[$@$!%*?&])[A-Za-z\d$@$!%*?&]{8,10}" 您可以编写简单的这一行来检查所有内容: <input type="password" name="psw" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" title="Must contain at least one number and one uppercase and lowercase letter, and at least 8 or more characters" required>

回答 2 投票 0

更改选择2的高度

我正在尝试更改包含箭头和所选选项的框的高度。我正在使用 select2,但我对此不太了解。这是我的代码: HTML: 我正在尝试更改包含箭头和所选选项的框的高度。我正在使用 select2,但我对此不太了解。这是我的代码: HTML: <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" crossorigin="anonymous"> <link rel="stylesheet" href="styles.css"> <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css" rel="stylesheet" /> <title>Hello, world!</title> </head> <body> <h1>Hello, world!</h1> <select class="form-select" id="searchSelect"> <option>Option 1</option> <option>Option 2</option> <option>Option 3</option> <option>Option 4</option> </select> <!-- Optional JavaScript --> <!-- jQuery first, then Popper.js, then Bootstrap JS --> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.slim.min.js" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" crossorigin="anonymous"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" crossorigin="anonymous"></script> <script src="script.js"></script> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script> </body> </html> CSS: body{ padding: 25px; } #select2-searchSelect-container { height: 50px; //This didn't work } JavaScript: $( document ).ready(function() { $("#searchSelect").select2(); }); 我尝试为 .select2-containter、.selection、.select2-selection、.select2-selection--single 添加高度,但都没有成功。 感谢您的帮助! 我尝试为 .select2-containter、.selection、.select2-selection、.select2-selection--single 添加高度,但都没有成功。 我不太确定你想要什么,但看起来你只是选择了错误的元素。从我看来,选择器应该类似于 .select2-container .select2-selection.select2-selection--single。特异性可能是另一个问题,在任何情况下,您可能选择了正确的元素,但另一种样式覆盖了您自己的元素。 $( document ).ready(function() { $("#searchSelect").select2(); }); body{ padding: 25px; } .select2-container .select2-selection.select2-selection--single { height: 50px; //Try this } <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" crossorigin="anonymous"> <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css" rel="stylesheet" /> <title>Hello, world!</title> </head> <body> <h1>Hello, world!</h1> <select class="form-select" id="searchSelect"> <option>Option 1</option> <option>Option 2</option> <option>Option 3</option> <option>Option 4</option> </select> <!-- Optional JavaScript --> <!-- jQuery first, then Popper.js, then Bootstrap JS --> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.slim.min.js" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" crossorigin="anonymous"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" crossorigin="anonymous"></script> <script src="script.js"></script> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script> </body> </html>

回答 1 投票 0

用占位符 {{text}} 替换 google 文档模板文本,并使用 google 工作表图像(图表:折线图、条形图、饼图)

我在 Google Sheets 中制作每日工作日志报告,并且必须每月提交该报告。为此,我的 Google 云端硬盘帐户中有一个模板报告。该模板需要启动...

回答 1 投票 0

JQuery 触发器点击不触发

我有一个年份列表,想要选择触发点击的第一个元素,但它没有按我的预期工作。这段代码让我到达我想要触发点击的元素,但它没有...

回答 1 投票 0

在数据表列中启用服务器端智能搜索

为了演示目的,我在闪亮中实现了一个示例数据表,可以在其中搜索整个数据表(通过使用右上角的搜索字段)和/或在特定的c...

回答 1 投票 0

在单击的元素外部设置 html 单击处理程序会立即触发

我有一个日历图标,其中有一个显示弹出日历的 onclick 处理程序,我想对其进行设置,以便单击日历弹出窗口之外的任何位置都会将其关闭。 然而,它驳回了

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.