Jquery追加到选择器添加变量可能吗?

2022-01-30 17:33:10 标签 jquery

我有代码:

<p>aaa</p>
<p>bbb</p>
<p>ccc</p>

我想在每一段前面加上一个复选框:

$("p").prepend("<input type='checkbox' name='xxx' id='xxx' /><label for='test'>xxx</label></span>");

但不是xxx,我需要输入一些变量,比如counter: var1 var2 var3…我怎么做呢?

# # #使用prepend as functi功能:

$("p").prepend(function(index, htmlContent) {
    console.log(htmlContent); //aaa, bbb, ccc -> the content of selected element
    return "<input type='checkbox' name='xxx' id='"+index+"' /><label for='test'>xxx</label></span>";
});

###你可能会搜索所谓的“模板字面量(模板字符串)”

请参阅下面的代码片段以获取使用示例。

更多信息请参见https://developer。mozilla。org/en-US/docs/Web/JavaScript/Reference/Template_literals

// $("p").prepend("<input type='checkbox' name='xxx' id='xxx' /><label for='test'>xxx</label></span>");
//let tmp = "<input type='checkbox' name='xxx' id='xxx' /><label for='test'>xxx</label></span>";
$("p").each(function( index ) {
   let name = `name_${index}`;
   let id =  `id_${index}`;
   let text = `${$(this).text()} ${index}`
   let output = `<input type='checkbox' name='${name}' id='${id}' /><label for='${name}'>${text}</label></span>`;
  
  console.log(output);
  $(this).html(output);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p>aaa</p>
<p>bbb</p>
<p>ccc</p>

### #创建一个字符串变量在第一个地方,你定义的xxx变量值正确,然后使用该字符串变量到prepend!应该没问题

(编辑)

const newXXX =" < input type='checkbox' name=" + 'xxx' new value' + " id='xxx' /><label for='test'> /label>"

$ (p) 。prepend (newXXX)

您可以使用任意字符串的concat方法

阅读全文

▼ 版权说明

相关文章也很精彩
推荐内容
更多标签
相关热门
全站排行
随便看看

错说 cuoshuo.com —— 程序员的报错记录

部分内容根据CC版权协议转载;网站内容仅供参考,生产环境使用务必查阅官方文档

辽ICP备19011660号-5

×

扫码关注公众号:职场神器
发送: 1
获取永久解锁本站全部文章的验证码