Question

我想获取所有表行数据，将它们推入数组并将其取回。但目前我只能获得前三列的值，但我无法获得图像的src。

我尝试data.push($(this).val(), $('img').attr('src'));但没有效果。

                      data = [];
                      $("#car-control-sum tbody>tr").remove();
                        $("#car-control-table tbody select, #car-control-table tbody input, #car-control-table tbody img").each(function(){
                            data.push($(this).val());
                        });

                        <table data-role="table" id="car-control-table" class="ui-responsive ui-shadow">
                        <thead>
                        <tr>
                            <th style="width:158px;border-bottom: 1px solid #d6d6d6;">Kontrollpunkt</th>
                            <th style="width:110px;border-bottom: 1px solid #d6d6d6;">OK</th>
                            <th style="width:158px;border-bottom: 1px solid #d6d6d6;">Kommentar</th>
                            <th style="width:110px;border-bottom: 1px solid #d6d6d6;">Ta bilde</th>
                            <th style="width:110px;border-bottom: 1px solid #d6d6d6;">Det.</th>

                        </tr>
                        </thead>
                        <tbody>
                        <tr class="car-row">
                            <td>
                                <select class="select-lys">
                                    <option value="Stotdempere">Stotdempere, fjaerer</option>
                                </select>
                            </td>

                            <td>
                                <select id="checkup_ok" data-role="slider" style="height:100px;">
                                    <option value=" ">Off</option>
                                    <option value="OK">On</option>
                                </select>
                            </td>

                            <td>
                                <input style="border: 2px solid #ccc;height:45px;" id="car-control-comment" name="car-control-comment"/>
                            </td>

                            <td>
                                <a style="height:40px;width:40px;margin-bottom:40px;"
                                   class="checkup_cam ui-btn ui-btn-inline ui-btn-icon-notext ui-btn-b ui-corner-all ui-icon-camera"></a>
                                <img class="checkup_thumb" style="padding-top:10px;"
                                     src="http://www.mountainmansocialmedia.com/_site/wp-content/themes/juiced/img/thumbnail-default.jpg"
                                     height="40" width="40">
                            </td>

                            <td>
                                <a style="height:40px;width:40px;" id="car-control-add"
                                   class="ui-btn ui-btn-inline ui-btn-icon-notext ui-btn-b ui-corner-all ui-icon-plus"></a>
                            </td>
                            <td>

                            </td>

                        </tr>
                        </tbody>

                    </table>

如何将图像src推入数据阵列？

Answer 1

考虑使用.prop（）而不是.attr（）

var src = $('#image-id').prop('src');
data.push(src);

Answer 2

尝试用this.value代替$(this).val()

   $("#car-control-table tbody select, #car-control-table tbody input, #car-control-table tbody img")
   .each(function() {
     data.push(this[this.nodeName === "input" ? "value" : "src"])
   });

var data = [];
                      //$("#car-control-sum tbody>tr").remove();
                      $("#car-control-table tbody select, #car-control-table tbody input, #car-control-table tbody img").each(function() {
                        data.push(this.value || this.src);
                      });
console.log(data)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table data-role="table" id="car-control-table" class="ui-responsive ui-shadow">
  <thead>
    <tr>
      <th style="width:158px;border-bottom: 1px solid #d6d6d6;">Kontrollpunkt</th>
      <th style="width:110px;border-bottom: 1px solid #d6d6d6;">OK</th>
      <th style="width:158px;border-bottom: 1px solid #d6d6d6;">Kommentar</th>
      <th style="width:110px;border-bottom: 1px solid #d6d6d6;">Ta bilde</th>
      <th style="width:110px;border-bottom: 1px solid #d6d6d6;">Det.</th>

    </tr>
  </thead>
  <tbody>
    <tr class="car-row">
      <td>
        <select class="select-lys">
          <option value="Stotdempere">Stotdempere, fjaerer</option>
        </select>
      </td>

      <td>
        <select id="checkup_ok" data-role="slider" style="height:100px;">
          <option value=" ">Off</option>
          <option value="OK">On</option>
        </select>
      </td>

      <td>
        <input style="border: 2px solid #ccc;height:45px;" id="car-control-comment" name="car-control-comment" />
      </td>

      <td>
        <a style="height:40px;width:40px;margin-bottom:40px;" class="checkup_cam ui-btn ui-btn-inline ui-btn-icon-notext ui-btn-b ui-corner-all ui-icon-camera"></a>
        <img class="checkup_thumb" style="padding-top:10px;" src="http://www.mountainmansocialmedia.com/_site/wp-content/themes/juiced/img/thumbnail-default.jpg" height="40" width="40">
      </td>

      <td>
        <a style="height:40px;width:40px;" id="car-control-add" class="ui-btn ui-btn-inline ui-btn-icon-notext ui-btn-b ui-corner-all ui-icon-plus"></a>
      </td>
      <td>

      </td>

    </tr>
  </tbody>

</table>

jQuery推送一个img元素

2 个答案: