TextArea - 连续调整所有textarea的大小

Question

我的HTML如下：

    <table border="2">
    
        <tbody><tr>
          <th></th>
          <th>Name</th>
          <th>Address</th>
          <th>Address2</th>
        </tr>
        <tr>
          <td>
            <button type="submit" name="delete" value="6">Delete</button>
          </td>
          <td>
            <section class="SectionClass">
              <div class="error"></div>
              <div class="inputClass">
                <input id="3da85a67e4914f09b6f673ed730b16a6_12" name="3da85a67e4914f09b6f673ed730b16a6_12" type="text" value="NAME Here">
              </div>
            </section>
          </td>
          <td>
            <section class="SectionClass">
              <div class="error"></div>
              <div class="textAreaClass">
                <textarea id="943a646acb564069b5ea6aca27bf6693_13" name="943a646acb564069b5ea6aca27bf6693_13">Address 1
    Address Line 2</textarea>
              </div>
            </section>
          </td>
          <td>
            <section class="SectionClass">
              <div class="error"></div>
              <div class="textAreaClass">
                <textarea id="15c3a14f3f4644dda6271cfab7e3b244_14" name="15c3a14f3f4644dda6271cfab7e3b244_14">D
    ffsf
    er</textarea>
              </div>
            </section>
          </td>
        </tr>
        <tr>
          <td>
            <button type="submit" name="delete" value="7">Delete</button>
          </td>
          <td>
            <section class="SectionClass">
              <div class="error"></div>
              <div class="inputClass">
                <input id="3da85a67e4914f09b6f673ed730b16a6_15" name="3da85a67e4914f09b6f673ed730b16a6_15" type="text" value="DSRE">
              </div>
            </section>
          </td>
          <td>
            <section class="SectionClass">
              <div class="error"></div>
              <div class="textAreaClass">
                <textarea id="943a646acb564069b5ea6aca27bf6693_16" name="943a646acb564069b5ea6aca27bf6693_16">DSS
    fs</textarea>
              </div>
            </section>
          </td>
          <td>
            <section class="SectionClass">
              <div class="error"></div>
              <div class="textAreaClass">
                <textarea id="15c3a14f3f4644dda6271cfab7e3b244_17" name="15c3a14f3f4644dda6271cfab7e3b244_17">ewff
    ww
    </textarea>
              </div>
            </section>
          </td>
        </tr>
      </tbody></table>

我可以点击右下方的调整大小图标来调整textarea的大小。调整一个textarea的大小时，我希望所有其他文本区域（在该行中）自动调整为Width的大小。

e.g。如果我正在调整地址col中的任何列，那么它应该调整所有地址行的大小。对于Address2

也是如此

Jquery或CSS解决方案应该没问题。

Answer 1

<script>
	$(document).ready(function () {
		// variables   
		var x=$('textarea').width();
		var y=$('textarea').height();
		
		$('textarea').mouseup(function () {
	 		//for resizing the entire textarea in that particular row.
			if ($(this).outerWidth() != x || $(this).outerHeight() != y ) {
				$(this).parents('tr').find('textarea').width($(this).outerWidth());
				$(this).parents('tr').find('textarea').height($(this).outerHeight());
			}
	
		});
	});
</script>