這可能會令人困惑,但卻是一個嚴肅的問題。
我正在使用 php 從回圈中獲取表行,并使用 ajax 在表標簽內顯示這些表。
這里的每一行都有一個名為productTableRow的 id 。
所以我想做的是,在這個表中,當我單擊特定行時,我想更改單擊行的背景顏色。僅該行并獲取名為product-id的單擊行屬性的值并將其顯示在另一個隱藏輸入
$(document).on('click', function(e){
if($(e.target).is('#productTableRow')){
var productId = $(e.target).attr('productId');
if(productId == productId){
$(e.target).css('background-color','#128C7E');
} else {
$('.trProductTable').css('background-color', 'transparent');
}
}
});
這是我生成表格行的 php 代碼,
foreach ($products as $product) {
$responseData .= "<tr id='productTableRow' productId='" . $product->id . "'>";
$responseData .= "<td>" . $product->id . "</td>";
$responseData .= "<td>" . $product->product_name . "</td>";
$responseData .= "<td>" . $product->product_barcode . "</td>";
if ($product->group_id == 0) {
$responseData .= "<td>None</td>";
} else {
$responseData .= "<td>" . $product->group_name . "</td>";
}
$responseData .= "<td>" . $product->product_cost . "</td>";
$responseData .= "<td>" . $product->product_selling . "</td>";
if ($product->product_type == 0) {
$responseData .= "<td>Liquid</td>";
} else if ($product->product_type == 1) {
$responseData .= "<td>Weight</td>";
} else if ($product->product_type == 2) {
$responseData .= "<td>Quantity</td>";
}
$responseData .= "<td>" . $product->created_at . "</td>";
嘗試了此代碼但不起作用,非常感謝您的幫助。
uj5u.com熱心網友回復:
將id更改為類后,我會試試這個
$('tr.productTableRow').click(function(){
var productId = $(this).attr('productId');
if(productId === productId){ // Always true
$(this).css('background-color','#128C7E');
} else {
// Do something when false ???
}
});
編輯注意:此代碼必須在表格添加到html后運行,如果需要在之前運行,請將代碼放在一個$(document).ready(function(){/*code */ });
編輯:根據評論回答
$(document).on('click', '.productTableRow', function(){
if(oldObject) {
$(oldObject).css('background-color', 'transparent');
}
var productId = $(this).attr('productId');
if(productId === productId){ // Always true
$(this).css('background-color','#128C7E');
}
oldObject = this;
});
uj5u.com熱心網友回復:
首先,id 必須特定于一個元素。Jquery 是這樣配置的。然后你可以使用$(this).parent(‘tr’)
來獲取可以到整個類的點擊事件中的父行。
uj5u.com熱心網友回復:
我得出了自己的答案,
$(document).on('click', '.groups-product-sidebar', (e)=>{
//Getting the clicked group attributes
var groupId = $(e.target).attr('groupId');
$('.groups-product-sidebar').parent().css('background-color','transparent');
$(e.target).parent().css('background-color','#128C7E');
});
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/471091.html
標籤:javascript php jQuery 阿贾克斯 拉拉维尔
