0

这是我用于克隆选择选项的代码：

var clone = $('#saleTable tbody>tr#saleTR:last').clone(true);
            clone.find("input").val('');
            clone.insertAfter('#saleTable tbody>tr#saleTR:last');

这是我的 HTML：

<tr id="saleTR">
  <td>
    <input name="qty[]" type="text" size="5" />
  </td>
  <td> 
    <select name="description[]" onchange="showPrice(this.value)">
      <option value="null">select Item sold</option>
      <?php getSaleItem(); ?>
    </select>
  </td>
  <td>
    <span id="price"></span>
  </td>
  <td>
  </td>
</tr>

我正在使用 ajax 来显示价格：

function showPrice(str){
    if (str.length==0){ 
        document.getElementById("price").innerHTML="";
        return;
    }
    if (window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
    }else{// code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function(){
        if (xmlhttp.readyState==4 && xmlhttp.status==200){
            document.getElementById("price").innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","getPrice.php?q="+str,true);
    xmlhttp.send();

}

克隆<tr>很好，但是当最后一个克隆的选择选项被选中或更改时，第一个价格是不断变化的价格而不是相应的价格，即第一个原始价格不断变化，而不是与选择选项变化一致的相应价格.

我想要一个特定的选择选项来更新相应的价格。

4

1 回答 1

0

在您的 html 中，您可以将此对象传递给您的 ajax 函数，然后您可以使用此指针来选择您对应的价格范围。

这可能对你有用

HTML

<tr id="saleTR">
    <td>
        <input name="qty[]" type="text" size="5" />
    </td>
    <td>
        <select name="description[]" onchange="showPrice(this)">
            <option value="null">select Item sold</option>
            <?php getSaleItem(); ?>
        </select>
    </td>
    <td><span id="price"></span>
    </td>
    <td></td>
</tr>

JAVASCRIPT

function showPrice(selectBox) {
    var str = selectBox.value;
    var corSpan=$(selectBox).closest('#saleTR').find('#price');
    if (str.length == 0) {
        corSpan.html() = "";
        return;
    }
    if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else { // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            corSpan.html(xmlhttp.responseText);
        }
    }
    xmlhttp.open("GET", "getPrice.php?q=" + str, true);
    xmlhttp.send();

}

见类似的例子http://jsfiddle.net/Yamw6/

于 2013-01-08T18:57:45.267 回答