如何使用jquery获取div当前文本框答案

【问题标题】：How to get the div current text box using jquery如何使用jquery获取div当前文本框
【发布时间】：2013-11-19 04:07:17
【问题描述】：

我有多个带有文本框的 div，想要获取每个 div 输入框的值并将其显示到该 div 本身中

HTML：

 <div id="product_data" class="ui-sortable">
  <div class="clonedInput" id="add_attribute" style="display: block;">
    <div id="add_attributes">
      <div id="accordion1">
        <h3>
          <input type="button" value="Remove" class="btnDel remove_row button" name="btnDelete1">
          <strong class="attribute_name"></strong> </h3>
          <table cellspacing="0" cellpadding="0" id="attribute_data" class="">
          <tbody>
            <tr>
              <td class="attribute_name"><label>Name:</label>
                <input type="text" id="attribute_name" class="attribute_name" name="attribute_names[]">
              </td>
              <td rowspan="3"><label>Value(s):</label>
                <textarea name="attribute_values[]" cols="5" rows="5" placeholder="Enter some text, or some attributes"></textarea>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
  </div>
  <div class="clonedInput" id="add_attribute_2" style="display: block;">
    <div id="add_attributes" class="woocommerce_attribute wc-metabox ">
      <div id="accordion1">
        <h3>
          <input type="button" value="Remove" class="btnDel remove_row button" name="btnDelete1">
          <strong class="attribute_name"></strong> </h3>
          <table cellspacing="0" cellpadding="0" id="attribute_data" class="">
          <tbody>
            <tr>
              <td class="attribute_name"><label>Name:</label>
                <input type="text" id="attribute_name" class="attribute_name" name="attribute_names[]">
              </td>
              <td rowspan="3"><label>Value(s):</label>
                <textarea name="attribute_values[]" cols="5" rows="5" placeholder="Enter some text, or some attributes"></textarea>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
  </div>
  <div class="clonedInput" id="add_attribute_3" style="display: block;">
    <div id="add_attributes" class="woocommerce_attribute wc-metabox ">
      <div id="accordion1">
        <h3>
          <input type="button" value="Remove" class="btnDel remove_row button" name="btnDelete1">
          <strong class="attribute_name"></strong> </h3>
          <table cellspacing="0" cellpadding="0" id="attribute_data" class="">
          <tbody>
            <tr>
              <td class="attribute_name"><label>Name:</label>
                <input type="text" id="attribute_name" class="attribute_name" name="attribute_names[]">
              </td>
              <td rowspan="3"><label>Value(s):</label>
                <textarea name="attribute_values[]" cols="5" rows="5" placeholder="Enter some text, or some attributes"></textarea>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
  </div>
</div>

我正在尝试获取输入字段值“id = attribute_name”并将该值显示到“模糊”函数中，这是动态文本框

【问题讨论】：

标签： javascript jquery html

【解决方案1】：

$( "input" ).blur(function() {
   var string = $(this).val();
   $(this).parent().append(string);
});

这将在从输入中删除光标时附加文本。根据您的要求设置样式。至少它应该让你知道该怎么做。

http://jsfiddle.net/L4UQJ/

【讨论】：

感谢您的精彩回答 :)
但是这个值应该显示在元素的上面，即..
仅在内 :(
在字符串中添加一些 HTML。制作一个相对定位和背景颜色为白色的 div。然后你需要一个关闭按钮，当点击关闭按钮时，你必须删除之前创建的 div。
您有重复的 id，不推荐。修复它们并在此处发布代码。然后我可以为你想要的写一些代码。也不要让课程变得如此多余。

【解决方案2】：

试试这个..

 $("input[type='text']").on('blur', function () {
          alert($(this).val());  
 });

【讨论】：

【解决方案3】：

终于成功了:)

$( "input" ).blur(function() {
            var string = $(this).val();
            $(this).closest('div').find('h3 > strong').html(string);

        });

DEMO

【讨论】：

【解决方案4】：

由于这些 HTML 元素是动态生成的，请使用以下方法。

   $(document).on('blur', '#attribute_name', function () {
      console.log($(this).val());  //To get the value of the textbox
      $(this).val(' ');
    });

【讨论】：