jQuery:按类更新所有span标记，并用textarea值填充

jQuery: Update, by class, all span tags and populate with textarea value?

本文关键字：标记 并用 textarea 填充 span 更新 jQuery      更新时间：2023-09-26

如何更新所有标签，使用class="able"，使用textarea值存储在textarea id="txtholder"class="txthodder字段"中

在Function Primary中，我尝试过：

$('span.able').text($('#Primary.txtholder').val());           FAIL
$('span.able').text($('#Document.Primary.txtholder').val());  FAIL
$('span.able').text($('#txtholder').val());                   FAIL

请告知。

感谢

Tak。

<html lang="en">
<head>
<meta charset="UTF-8" />
<title>jQuery Pass textarea value to all class=able SPANs</title>
<link rel="stylesheet" href="themes/base/jquery.ui.all.css">
<script type="text/javascript" src="js/jquery-ui-1.8.16.custom.min.js"></script>
<script src="js/jquery-1.6.2.min.js"></script>
<script src="ui/jquery.ui.core.js"></script>
<script>
$(function() {
$('#button1').click (function () {
$('span.able').text($('#Primary.txtholder').val());    
});
</script>
</head>
<body>
<div>
<Fieldset>
<form name="Primary" method="post" action="" >
<font size="2" color="maroon"><b>TEXTAREA VALUES:</b></font><br>
<textarea id="txtholder" class="txtholder" name="txtholder" rows="8" cols="45">
8012,Ms 8012,8012@something.com; 8013,Mr. 8013,8013@somethingelse.com; 8014,Mr. 8014,8014@somethingelse.com; 
8015,Mrs. 8015,8015@somethinggood.com; 8016,Mrs. 8016,8016@something.com; 8017,Ms 8017,8017@somethingelse.com; 
8018,Ms 8018,8018@something.com; 8019,Mr. 8019,8019@somethingelse.com; 8020,Mr. 8020,8020@somethingelse.com; 
</textarea><br>
<input type="Button" id="button1" Value="LOAD">
</Fieldset>
</form>
</div>
<span id="result1" class="able"> </span>
<span id="result2" class="able"> </span>
<span id="result3" class="able"> </span>
<span id="result4" class="baker"> </span>
<span id="result5" class="baker"> </span>
<span id="result6" class="charlie"> </span>
</body>
</html>

您的最后一个：

$('span.able').text($('#txtholder').val());

作品（证明）。（或者，如果你不想将其限制为跨度[你在问题文本中说了"所有标签"，这可能意味着几件事，但标题中的"所有跨度标签"]，只需$('.able').text(...);）

真正的问题是你放入的脚本。有了适当的缩进，问题就更清楚了：

<script>
$(function() {
    $('#button1').click (function () {
        $('span.able').text($('#Primary.txtholder').val());    
    });
</script>

正如您所看到的，您还没有结束对$的第一次调用。所以你在里面放什么并不重要，因为脚本语法是无效的。将其更改为：

<script>
$(function() {
    $('#button1').click (function () {
        $('span.able').text($('#txtholder').val());  // <=== Fix
    });
}); // <=== Fix
</script>

一致地缩进代码确实有助于防止此类错误。查看浏览器的JavaScript控制台以查找错误，并使用适当的调试器来监视代码的运行，这也很有用。

相关文章：