Question

我在一个页面上有很多项目，一个人可以查看每个项目。当他们点击“查看”时，灯箱将打开并填写表格。要知道正在审核的内容，我将项目名称传递到表单字段中。但是我无法通过数据。

如何将项目名称传递到表单？

以下是尝试的代码：

的 HTML 的

<div class="element indica" data-category="indica">
  <p class="type">I</p>
  <h2 class="name">Name</h2> <!-- Information I want to pass -->
  <p class="strain-info">Information Here</p>
  <p class="review"><a class="fancy_button review-form-lb" href="#review-form-lightbox"><span style="background-color: #000;">Review Strain</span></a></p>
</div>

表格代码

<!-- I omitted form code not relevant to question. -->
<input name="CAT_Custom_365569" type="text" class="cat_textbox" id="CAT_Custom_365569" value=" " maxlength="4000" readonly="readonly" />

的 JS 的

$('.fancy_button').click(function(){
   var strain = $(this).prev('h2').text();
   $('#CAT_Custom_365569').val(strain);
});

Answer 1

prev选择立即之前的兄弟，因此它不会在你的情况下工作。传递选择器意味着只有当匹配＆＃34;时才抓住前一个兄弟。试试这个：

var strain = $(this).closest('div').find('h2').text();

Answer 2

@elclanrs右上角选择前一个兄弟，当你给它一个选择器时，它会验证前一个符合选择标准。

这是实现理想结果的另一种方法。

$('.fancy_button').click(function(){   
    var strain = $(this).parent().siblings('h2').text();   
    $('#CAT_Custom_365569').val(strain);
});

Answer 3

这就是我要做的事情：

输出HTML时，将一个名为“data-name”的新属性添加到a元素：

<a data-name="the name" class="fancy_button review-form-lb" href="#review-form-lightbox"><span style="background-color: #000;">Review Strain</span></a>

然后在您的点击处理程序中，执行以下操作：

$('.fancy_button').click(function(){
   var strain = encodeURIComponent($(this).attr('data-name'));
   $('#CAT_Custom_365569').val(strain);
});

这样做的好处是，您不必依赖链接之外的某些标记，这些标记将来可能会发生变化。我还编码了名称值，以防万一有可能弄乱的字符......可能适用也可能不适用。

Answer 4

类选择器以点为前缀。

$(".element indica").find('.name').val();

将数据传递到表单域

4 个答案: