或
）赋值，以下是常用的几种方式： 通过…"> <link rel="shortcut icon" href="http://www.lqzhan.com/favicon.ico" type="image/x-icon"> <meta name="generator" content="Z-BlogPHP 1.7.5"> <script src="http://www.lqzhan.com/zb_system/script/jquery-latest.min.js"></script> <script src="http://www.lqzhan.com/zb_system/script/zblogphp.js"></script> <script src="http://www.lqzhan.com/zb_system/script/c_html_js_add.php"></script> <link rel="stylesheet" href="http://www.lqzhan.com/zb_users/theme/tpure/plugin/share/share.min.css"> <script src="http://www.lqzhan.com/zb_users/theme/tpure/plugin/share/jquery.share.min.js"></script> <link rel="stylesheet" rev="stylesheet" href="http://www.lqzhan.com/zb_users/theme/tpure/style/style.css?v=6.6" type="text/css" media="all"> <script src="http://www.lqzhan.com/zb_users/theme/tpure/plugin/qrcode/jquery.qrcode.min.js"></script> <script src="http://www.lqzhan.com/zb_users/theme/tpure/script/common.js?v=6.6"></script> <script>Object.assign(window.tpure || {},{linkblank:true,qrsize:70,bannerdisplay:true,viewall:true,viewallstyle:1,viewallheight:'800',setnightstart:'1',setnightover:'1',waterfallpccolumn:3,waterfallwidecolumn:4,waterfallmgap:12,waterfallpcgap:30,tfontsize:true,fixsidebar:true,fixsidebarstyle:'0',removep:true,backtotop:true,backtotopvalue:0,version:'6.6'});</script> <link rel="canonical" href="http://www.lqzhan.com/post/47106.html"> <meta property="og:type" content="article"> <meta property="og:title" content="jquery给文本框赋值 - jquery"> <meta property="og:description" content="使用 jQuery 给文本框赋值 jQuery 提供了多种方法给文本框（<input type="text"> 或 <textarea>）赋值，以下是常用的几种方式： 通过…"> <meta property="og:url" content="http://www.lqzhan.com/post/47106.html"> <meta property="og:image" content="https://lqzhan.com/zb_users/cache/ly_autoimg/jquery%E7%BB%99%E6%96%87%E6%9C%AC%E6%A1%86%E8%B5%8B%E5%80%BC.jpg"> <meta property="og:site_name" content="VUE"> <meta property="og:locale" content="zh_CN"> <meta property="og:updated_time" content="2026-03-17T01:09:40"> <meta property="article:published_time" content="2026-03-17T01:09:40"> <meta property="article:modified_time" content="2026-03-17T01:09:40"> <meta property="article:author" content="百变鹏仔"> <meta property="article:section" content="jquery"> <meta property="article:tag" content="赋值,文本框"> <meta property="bytedance:published_time" content="2026-03-17T01:09:40"> <meta property="bytedance:updated_time" content="2026-03-17T01:09:40"> <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:title" content="jquery给文本框赋值 - jquery"> <meta name="twitter:description" content="使用 jQuery 给文本框赋值 jQuery 提供了多种方法给文本框（<input type="text"> 或 <textarea>）赋值，以下是常用的几种方式： 通过…"> <meta name="twitter:image" content="https://lqzhan.com/zb_users/cache/ly_autoimg/jquery%E7%BB%99%E6%96%87%E6%9C%AC%E6%A1%86%E8%B5%8B%E5%80%BC.jpg"> <meta name="twitter:url" content="http://www.lqzhan.com/post/47106.html"> <script type="application/ld+json"> { "@context": "https://ziyuan.baidu.com/contexts/cambrian.jsonld", "@id": "http://www.lqzhan.com/post/47106.html", "title": "jquery给文本框赋值 - jquery", "images": ["https://lqzhan.com/zb_users/cache/ly_autoimg/jquery%E7%BB%99%E6%96%87%E6%9C%AC%E6%A1%86%E8%B5%8B%E5%80%BC.jpg"], "description": "使用 jQuery 给文本框赋值 jQuery 提供了多种方法给文本框（<input type=\"text\"> 或 <textarea>）赋值，以下是常用的几种方式： 通过…", "pubDate": "2026-03-17T01:09:40", "upDate": "2026-03-17T01:09:40" } </script> <script type="application/ld+json"> { "@context": "https://schema.org", "@type": "Article", "mainEntityOfPage": { "@type": "WebPage", "@id": "http://www.lqzhan.com/post/47106.html" }, "headline": "jquery给文本框赋值 - jquery", "image": "https://lqzhan.com/zb_users/cache/ly_autoimg/jquery%E7%BB%99%E6%96%87%E6%9C%AC%E6%A1%86%E8%B5%8B%E5%80%BC.jpg", "author": { "@type": "Person", "name": "百变鹏仔" }, "publisher": { "@type": "Organization", "name": "VUE", "logo": { "@type": "ImageObject", "url": "http://www.lqzhan.com/logo.png" } }, "datePublished": "2026-03-17T01:09:40", "dateModified": "2026-03-17T01:09:40" } </script> </head> <body class="article"> <div class="wrapper"> <div class="header fixed"> <div class="wrap"> <div class="logo on"><a href="http://www.lqzhan.com/"><img src="http://www.lqzhan.com/logo.png" alt="前端开发社区"><img src="http://www.lqzhan.com/logo.png" alt="前端开发社区"></a></div> <div class="head"> <div class="menuico"><span></span><span></span><span></span></div> <div class="menu"> <ul class="nosch"> <li class="navbar-item"><a href="http://www.lqzhan.com/">首页</a></li><li class="navbar-item"><a href="http://www.lqzhan.com/category-1.html" title="VUE">VUE.js</a></li><li class="navbar-item"><a href="http://www.lqzhan.com/category-2.html" title="React">React.js</a></li><li class="navbar-item"><a href="http://www.lqzhan.com/category-3.html" title="HTML">HTML</a></li><li class="navbar-item"><a href="http://www.lqzhan.com/category-4.html" title="CSS">CSS</a></li><li class="navbar-item"><a href="http://www.lqzhan.com/category-6.html" title="JavaScript">JavaScript</a></li><li class="navbar-item"><a href="http://www.lqzhan.com/category-5.html" title="PHP">PHP</a></li><li class="navbar-item"><a href="http://www.lqzhan.com/category-7.html" title="jquery">jquery</a></li><li class="navbar-item"><a href="http://www.lqzhan.com/category-8.html" title="Java">Java</a></li><li class="navbar-item"><a href="http://www.lqzhan.com/category-9.html" title="MySQL">MySQL</a></li><li class="navbar-item"><a href="http://www.lqzhan.com/category-10.html" title="uniapp">uniapp</a></li> </ul> </div> </div> </div> </div> <div class="main fixed"> <div class="banner" data-type="display" data-speed="2" style="height:360px; background-image:url(https://wokezhineng.oss-cn-huhehaote.aliyuncs.com/image/20260107/7d11121e-d75d-4f0f-b8ad-05b770b63882.png);"> <div class="wrap"> <div class="hellotip"> 前端开发社区 </div> </div> </div> <div class="maincon"> <div class="wrap"> <div class="sitemap">当前位置：<a href="http://www.lqzhan.com/">首页</a> > <a href="http://www.lqzhan.com/category-7.html">jquery</a> </div> <div id="sticky"> <div class="content"> <div data-cateurl="http://www.lqzhan.com/category-7.html" class="block"> <div class="post"> <h1>jquery给文本框赋值</h1> <div class="info"> <span class="date">2026-03-17 01:09:40</span><span class="cate"><a href="http://www.lqzhan.com/category-7.html">jquery</a></span> <div class="ctrl"><a href="javascript:;" title="增加字号"></a><a href="javascript:;" title="减小字号"></a><a href="javascript:;" title="还原字号" class="hide"></a></div> </div> <div class="single"> <h3>使用 jQuery 给文本框赋值</h3> <p>jQuery 提供了多种方法给文本框（<code><input type="text"></code> 或 <code><textarea></code>）赋值，以下是常用的几种方式：</p> <p><strong>通过 <code>val()</code> 方法赋值</strong></p> <p><code>val()</code> 是 jQuery 中用于获取或设置表单元素值的核心方法。以下示例展示如何通过 ID 或类名选中文本框并赋值：</p> <pre><code class="language-javascript">// 通过 ID 选中文本框并赋值 $("#textBoxId").val("这是赋值内容"); // 通过类名选中文本框并赋值（多个元素时会全部赋值） $(".textBoxClass").val("这是赋值内容");</code></pre> <p><strong>通过属性选择器赋值</strong></p> <p style="text-align:center"><img src="https://lqzhan.com/zb_users/cache/ly_autoimg/jquery%E7%BB%99%E6%96%87%E6%9C%AC%E6%A1%86%E8%B5%8B%E5%80%BC.jpg" alt="jquery给文本框赋值" title="jquery给文本框赋值" /></p> </p> <p>如果文本框没有明确的 ID 或类名，可以通过属性选择器（如 <code>name</code>）定位：</p> <pre><code class="language-javascript">// 通过 name 属性赋值 $("input[name='username']").val("这是用户名"); // 通过 type 属性赋值（适用于所有文本框） $("input[type='text']").val("这是通用赋值");</code></pre> <p><strong>动态生成内容后赋值</strong></p> <p>结合其他 jQuery 方法（如 <code>append()</code>）动态生成文本框并赋值：</p> <p style="text-align:center"><img src="https://lqzhan.com/zb_users/cache/ly_autoimg/jquery%E7%BB%99%E6%96%87%E6%9C%AC%E6%A1%86%E8%B5%8B%E5%80%BC.1.jpg" alt="jquery给文本框赋值" title="jquery给文本框赋值" /></p> <pre><code class="language-javascript">// 动态创建文本框并添加到 DOM 后赋值 var $input = $("<input type='text' class='dynamic-input'>"); $("body").append($input); $(".dynamic-input").val("动态生成的文本框");</code></pre> <p><strong>清空文本框内容</strong></p> <p>如果需要清空文本框，可以传递空字符串或调用无参数的 <code>val()</code>：</p> <pre><code class="language-javascript">// 清空文本框 $("#textBoxId").val(""); // 等效写法 $("#textBoxId").val();</code></pre> <p><strong>注意事项</strong></p> <ul><li>确保 DOM 加载完成后再操作文本框，推荐将代码放在 <code>$(document).ready()</code> 中：<pre><code class="language-javascript">$(document).ready(function() { $("#textBoxId").val("页面加载后赋值"); });</code></pre> </li> <li>对于 <code><textarea></code>，赋值方式与 <code><input type="text"></code> 完全相同。</li> <li>如果赋值后未生效，检查选择器是否能正确匹配目标元素。</li> </ul></p> </div> <div class="tags"> 标签: <a href='http://www.lqzhan.com/tags-453.html' title='赋值'>赋值</a><a href='http://www.lqzhan.com/tags-2541.html' title='文本框'>文本框</a> </div> <div class="sharebox"> <div class="label">分享给朋友：</div> <div class="sharebtn"> <div data-sites="qq,wechat,weibo,qzone" class="sharing"></div> </div> </div> </div> </div> <div class="block"> <div class="posttitle"><h4>相关文章</h4></div> <div class="relatecon"> <div class="relate"><div class="relateimg"><a href="http://www.lqzhan.com/post/12379.html" title="vue3中react如何赋值"><img src="https://lqzhan.com/zb_users/cache/ly_autoimg/vue3%E4%B8%ADreact%E5%A6%82%E4%BD%95%E8%B5%8B%E5%80%BC.jpg" alt="vue3中react如何赋值"></a></div><div class="relateinfo"> <h3><a href="http://www.lqzhan.com/post/12379.html" title="vue3中react如何赋值">vue3中react如何赋值</a></h3> <p class="isimg">在Vue 3中，React组件的赋值或集成通常涉及跨框架交互或状态管理。以下是几种常见场景下的处理方法： 使用Web Components封装React组件 将React组件封装为Web Compo…</p></div> </div><div class="relate"><div class="relateimg"><a href="http://www.lqzhan.com/post/16301.html" title="js实现焦点聚焦文本框"><img src="https://lqzhan.com/zb_users/cache/ly_autoimg/js%E5%AE%9E%E7%8E%B0%E7%84%A6%E7%82%B9%E8%81%9A%E7%84%A6%E6%96%87%E6%9C%AC%E6%A1%86.jpg" alt="js实现焦点聚焦文本框"></a></div><div class="relateinfo"> <h3><a href="http://www.lqzhan.com/post/16301.html" title="js实现焦点聚焦文本框">js实现焦点聚焦文本框</a></h3> <p class="isimg">实现焦点聚焦文本框的方法 使用JavaScript聚焦文本框可以通过多种方式实现，以下是几种常见的方法： 方法1：使用focus()方法 通过DOM获取文本框元素后调用focus()方法： do…</p></div> </div><div class="relate"><div class="relateimg"><a href="http://www.lqzhan.com/post/18983.html" title="jquery给select赋值"><img src="https://lqzhan.com/zb_users/cache/ly_autoimg/jquery%E7%BB%99select%E8%B5%8B%E5%80%BC.jpg" alt="jquery给select赋值"></a></div><div class="relateinfo"> <h3><a href="http://www.lqzhan.com/post/18983.html" title="jquery给select赋值">jquery给select赋值</a></h3> <p class="isimg">使用 jQuery 给 select 赋值 jQuery 提供了多种方法来动态设置 <select> 元素的值或选项。以下是几种常见场景的实现方式： 设置选中值 通过 val() 方法可…</p></div> </div><div class="relate"><div class="relateimg"><a href="http://www.lqzhan.com/post/19196.html" title="java如何给数组赋值"><img src="https://lqzhan.com/zb_users/cache/ly_autoimg/java%E5%A6%82%E4%BD%95%E7%BB%99%E6%95%B0%E7%BB%84%E8%B5%8B%E5%80%BC.jpg" alt="java如何给数组赋值"></a></div><div class="relateinfo"> <h3><a href="http://www.lqzhan.com/post/19196.html" title="java如何给数组赋值">java如何给数组赋值</a></h3> <p class="isimg">数组赋值的几种方法 在Java中，可以通过多种方式给数组赋值。以下是几种常见的数组赋值方法： 静态初始化 静态初始化是在声明数组的同时直接指定元素值，适用于已知数组元素的情况： int[] ar…</p></div> </div><div class="relate"><div class="relateimg"><a href="http://www.lqzhan.com/post/19623.html" title="在java中如何给数组赋值"><img src="https://lqzhan.com/zb_users/cache/ly_autoimg/%E5%9C%A8java%E4%B8%AD%E5%A6%82%E4%BD%95%E7%BB%99%E6%95%B0%E7%BB%84%E8%B5%8B%E5%80%BC.jpg" alt="在java中如何给数组赋值"></a></div><div class="relateinfo"> <h3><a href="http://www.lqzhan.com/post/19623.html" title="在java中如何给数组赋值">在java中如何给数组赋值</a></h3> <p class="isimg">数组初始化的方法 在Java中，可以通过多种方式为数组赋值。数组的赋值操作可以在声明时完成，也可以在声明后单独进行。 静态初始化（声明时赋值） int[] numbers = {1, 2, 3,…</p></div> </div><div class="relate"><div class="relateimg"><a href="http://www.lqzhan.com/post/20072.html" title="java 二维数组如何赋值"><img src="https://lqzhan.com/zb_users/cache/ly_autoimg/java+%E4%BA%8C%E7%BB%B4%E6%95%B0%E7%BB%84%E5%A6%82%E4%BD%95%E8%B5%8B%E5%80%BC.jpg" alt="java 二维数组如何赋值"></a></div><div class="relateinfo"> <h3><a href="http://www.lqzhan.com/post/20072.html" title="java 二维数组如何赋值">java 二维数组如何赋值</a></h3> <p class="isimg">初始化时直接赋值 可以在声明二维数组的同时进行赋值，使用花括号 {} 嵌套表示每一行的元素。 int[][] arr = { {1, 2, 3}, // 第一行 {4,…</p></div> </div> </div> </div> </div> <div class="sidebar fixed"> <dl id="tpure_NewArticle" class="sidebox alone"> <dt class="sidetitle">最新文章</dt> <dd> <ul><li class="sideitem"><a href="http://www.lqzhan.com/post/47165.html" target="_blank" title="jquery获取下标" class="itemtitle">jquery获取下标</a><p class="sideinfo"><em class="view">2026-03-17 02:55:47</em></p> </li><li class="sideitem"><a href="http://www.lqzhan.com/post/47164.html" target="_blank" title="jquery 中文网" class="itemtitle">jquery 中文网</a><p class="sideinfo"><em class="view">2026-03-17 02:54:22</em></p> </li><li class="sideitem"><a href="http://www.lqzhan.com/post/47163.html" target="_blank" title="jquery图片轮播代码" class="itemtitle">jquery图片轮播代码</a><p class="sideinfo"><em class="view">2026-03-17 02:52:54</em></p> </li><li class="sideitem"><a href="http://www.lqzhan.com/post/47162.html" target="_blank" title="jquery mobile ui" class="itemtitle">jquery mobile ui</a><p class="sideinfo"><em class="view">2026-03-17 02:50:56</em></p> </li><li class="sideitem"><a href="http://www.lqzhan.com/post/47161.html" target="_blank" title="jquery控制div显示隐藏" class="itemtitle">jquery控制div显示隐藏</a><p class="sideinfo"><em class="view">2026-03-17 02:48:01</em></p> </li></ul> </dd> </dl><dl id="divTags" class="sidebox alone"> <dt class="sidetitle">标签列表</dt> <dd> <ul><li><a title="vue" href="http://www.lqzhan.com/tags-2.html">vue<span class="tag-count"> (13920)</span></a></li> <li><a title="原理" href="http://www.lqzhan.com/tags-3.html">原理<span class="tag-count"> (619)</span></a></li> <li><a title="拖拽" href="http://www.lqzhan.com/tags-4.html">拖拽<span class="tag-count"> (425)</span></a></li> <li><a title="分页" href="http://www.lqzhan.com/tags-5.html">分页<span class="tag-count"> (587)</span></a></li> <li><a title="跳转" href="http://www.lqzhan.com/tags-6.html">跳转<span class="tag-count"> (573)</span></a></li> <li><a title="页面" href="http://www.lqzhan.com/tags-7.html">页面<span class="tag-count"> (1076)</span></a></li> <li><a title="路由" href="http://www.lqzhan.com/tags-12.html">路由<span class="tag-count"> (649)</span></a></li> <li><a title="列表" href="http://www.lqzhan.com/tags-14.html">列表<span class="tag-count"> (461)</span></a></li> <li><a title="功能" href="http://www.lqzhan.com/tags-16.html">功能<span class="tag-count"> (1236)</span></a></li> <li><a title="项目" href="http://www.lqzhan.com/tags-20.html">项目<span class="tag-count"> (502)</span></a></li> <li><a title="菜单" href="http://www.lqzhan.com/tags-23.html">菜单<span class="tag-count"> (435)</span></a></li> <li><a title="组件" href="http://www.lqzhan.com/tags-24.html">组件<span class="tag-count"> (1021)</span></a></li> <li><a title="表格" href="http://www.lqzhan.com/tags-25.html">表格<span class="tag-count"> (662)</span></a></li> <li><a title="数据" href="http://www.lqzhan.com/tags-28.html">数据<span class="tag-count"> (485)</span></a></li> <li><a title="图片" href="http://www.lqzhan.com/tags-30.html">图片<span class="tag-count"> (767)</span></a></li> <li><a title="js" href="http://www.lqzhan.com/tags-32.html">js<span class="tag-count"> (3409)</span></a></li> <li><a title="如何实现" href="http://www.lqzhan.com/tags-76.html">如何实现<span class="tag-count"> (1639)</span></a></li> <li><a title="效果" href="http://www.lqzhan.com/tags-79.html">效果<span class="tag-count"> (610)</span></a></li> <li><a title="react" href="http://www.lqzhan.com/tags-289.html">react<span class="tag-count"> (3311)</span></a></li> <li><a title="jquery" href="http://www.lqzhan.com/tags-296.html">jquery<span class="tag-count"> (1398)</span></a></li> <li><a title="css" href="http://www.lqzhan.com/tags-298.html">css<span class="tag-count"> (2718)</span></a></li> <li><a title="php" href="http://www.lqzhan.com/tags-591.html">php<span class="tag-count"> (4571)</span></a></li> <li><a title="java" href="http://www.lqzhan.com/tags-783.html">java<span class="tag-count"> (1889)</span></a></li> <li><a title="uniapp" href="http://www.lqzhan.com/tags-788.html">uniapp<span class="tag-count"> (1363)</span></a></li> <li><a title="elementui" href="http://www.lqzhan.com/tags-793.html">elementui<span class="tag-count"> (828)</span></a></li> </ul> </dd> </dl></div> </div> </div> </div> </div> </div> <div class="footer"> <div class="fademask"></div> <div class="wrap"> <h3> <script charset="UTF-8" id="LA_COLLECT" src="//sdk.51.la/js-sdk-pro.min.js"></script> <script>LA.init({id:"JERF9ixTITi0GXmv",ck:"JERF9ixTITi0GXmv",autoTrack:true,hashMode:true})</script> <script id="LA-DATA-WIDGET" crossorigin="anonymous" charset="UTF-8" src="https://v6-widget.51.la/v6/JERF9ixTITi0GXmv/quote.js?theme=#1690FF,#1690FF,#1690FF,#1690FF,#FFFFFF,#1690FF,12&f=12&display=0,1,1,1,1,1,0,0"></script> <a href="https://beian.miit.gov.cn/" target="_blank">陕ICP备2023000799号</a> <a href="http://www.lqzhan.com/sitemap.txt" target="_blank">网站地图</a></h3> <h4>Powered By <a href="https://www.zblogcn.com/" title="Z-BlogPHP 1.7.5 Build 173540" target="_blank" rel="noopener noreferrer">Z-BlogPHP</a>. Theme by <a href="https://www.toyean.com/" target="_blank" title="拓源网">TOYEAN</a>.</h4> <link rel="stylesheet" href="http://www.lqzhan.com/zb_users/plugin/Jz52_code/Jz52_code.css"><script src="http://www.lqzhan.com/zb_users/plugin/Jz52_code/clipboard.min.js"></script><script src="http://www.lqzhan.com/zb_users/plugin/Jz52_code/Jz52_code.js"></script> </div> </div> <div class="edgebar"> <a href="javascript:$.translatePage();" target="_self" id="zh_language" data-title="繁简体切换" class="lang"></a> <script>var cookieDomain = "http://www.lqzhan.com/";</script> <script src="http://www.lqzhan.com/zb_users/theme/tpure/plugin/convert/zh_language.js"></script> </div> </body> </html><!--203.52 ms , 8 queries , 5323kb memory , 0 error-->