jquery檢索表單選定的選項文本和打印表

Question

我想用所有輸入值和選定的選項文本打印表單。它適用於文本和數字輸入的其餘部分，但問題在於選擇選項。無論選擇何種選項，它僅打印下拉菜單中的第一個選項（T4 + T4）。我想它來打印從所選

<div id="printContent"> 
<table border="1" class="css-serial" id="POITable"> 
       <!-- Rand Titlu --> 
       <tr> 
        <th>Nr</th> 
        <th>Latime (mm)</th> 
        <th>Lungime (mm)</th> 
        <th>Cantitate</th> 
        <th>Material</th> 
        <th>Client</th> 
        <th>Suprafata (m2)</th> 
        <th>Total (€)</th> 
        <th>Sterge</th> 
       </tr> 
        <!-- Rand 1 formular --> 
       <tr class="item"> 
        <td>1</td> 
        <td><input id="latime_sticla" type="number" class="form-control lat amount" value=""></td> 
        <td><input id="lungime_sticla" type="number" class="form-control lung amount" value=""></td> 
        <td><input type="number" class="form-control cant amount" value=""></td> 
        <td> 
         <select id="materialSticla" name="material" class="form-control price amount" onchange="calculPret()"> 
          <option value="13.5">T4+T4</option> 
          <option value="14.5">T4+Low</option> 
          <option value="16.1">T4+4 Anotimpuri</option> 
          <option value="18.5">T4+P</option> 
          <option value="20.8">T4+Stopsol</option> 
          <option value="16.5">T4+Niagara Alb</option> 
          <option value="14.7">T4+Delta Alb</option> 
          <option value="15.5">T4+Diamant</option> 
          <option value="15.5">T4+Krizet</option> 
          <option value="16.5">T4+Cincilla Alb</option> 
          <option value="19.5">T4+Niagara Bronz</option> 
          <option value="19.5">T4+Delta Bronz</option> 
          <option value="19.5">T4+Cincilla Bronz</option> 
          <option value="19.8">Oglinda+Oglinda</option> 
          <option value="21.5">Oglinda+Mat Alb</option> 
          <option value="24.5">Oglinda+Mat Bronz</option> 
          <option value="24.21">T4+T4+4 Anotimpuri</option> 
          <option value="25.6">T4+4 Anotimpuri+Low</option> 
          <option value="26.8">T4+T4+Mat Alb</option> 
          <option value="27.8">T4+T4+Mat Bronz</option> 
          <option value="29.6">T4+4 Anotimpuri + Mat Alb</option> 
          <option value="30.6">T4+4 Anotimpuri + Mat Bronz</option> 
         </select> 
        </td> 
        <td><input type="text" class="form-control" value=""></td> 
        <td><input type="text" name="suprafata" class="form-control totals" id="totals" value=""readonly="readonly"></td> 
        <td><input type="text" name="total" class="form-control total" id="total1" value=""readonly="readonly"></td> 
        <td><input type="button" class="btn btn-danger" id="delPOIbutton" value=" - " onclick="deleteRow(this)"/></td> 
       </tr> 
      </table> 
      </div> 

這裏該選項的文本是JavaScript

function calculPret() { 

$(".item").each(function() { 
      var lat = 1; 
      var lung = 1; 
      var cant = 1; 
      var price = 1; 
      var total = 1; 
      if (!isNaN(parseFloat($(this).find(".lat").val()))) { 
       lat = parseFloat($(this).find(".lat").val()); 
      } 
      if (!isNaN(parseFloat($(this).find(".lung").val()))) { 
       lung = parseFloat($(this).find(".lung").val()); 
      } 
      if (!isNaN(parseFloat($(this).find(".cant").val()))) { 
       cant = parseFloat($(this).find(".cant").val()); 
      } 
      if (!isNaN(parseFloat($(this).find(".price").val()))) { 
       price = parseFloat($(this).find(".price").val()); 
      } 

      var arie = (lung * lat); 
      var arieM = (arie/1000000); 
      var pretTotal = (arieM * price * cant); 
      total = pretTotal; 
      $(this).find(".totals").val(arieM.toFixed(2)); 
      $(this).find(".total").val(total.toFixed(2)); 
     }); 

var sum = 0; 

$(".total").each(function() { 

    if (!isNaN(this.value) && this.value.length != 0) { 
     sum += parseFloat(this.value); 
     } 
    }); 

var sumsuprafata = 0; 

$(".totals").each(function() { 

    if (!isNaN(this.value) && this.value.length != 0) { 
     sumsuprafata += parseFloat(this.value); 
     } 
    }); 

    $("#totalSuprafata").val(sumsuprafata.toFixed(2)); 
    $("#totalPret").val(sum.toFixed(2)); 
    $("#TVA").val(sum.toFixed(2) * 0.19); 
    $("#totalPretTVA").val(parseFloat(sum.toFixed(2)) + parseFloat(($("#TVA").val()))); 
} 

function printDiv() { 

$('form input[type=number]').each(function() { 
    $(this).attr('value', $(this).val()); 
}); 

$('form input[type=text]').each(function() { 
    $(this).attr('value', $(this).val()); 
}); 

$("select").change(function() { 
    $(this.options[this.selectedIndex].text); 
}); 

    var divToPrint = document.getElementById('printContent'); 
    newWin = window.open(""); 
    newWin.document.write(divToPrint.outerHTML); 
    newWin.print(); 
    newWin.close(); 
} 

here is an example, the options were not T4+T4

Answer 1

我相信，你的目標是確保當你寫的表格的內容添加到新窗口中，選定的值將在新窗口中選擇。 因此，換句話說，您需要確保用戶選擇的<option>標籤上存在'selected'屬性。

所以：

$('select').change(function() { 
    $(this.options).removeAttr('selected'); 
    $(this.options[this.selectedIndex]).attr('selected', 'selected'); 
}); 

說明：

$(this.options).removeAttr('selected'); 

刪除從以前的選擇selected屬性，

$(this.options[this.selectedIndex]).attr('selected', 'selected'); 

添加selected屬性選擇<option>新。

希望這會有所幫助。