Question

我在foreach中使用Tabs，这是我的代码：

foreach ($pdts as $pdt=>$r){

    echo'<tr>';
        echo'
        <td><div style="width: 10px;"><span id="plus-'.$pdt.'"> + </span><br/>


            </div></td>
        <td><div style="width:200px; text-align:center">'.$r['Product_Number'].'</div></td>
        <td><div  style="width:200px; text-align:center">'.$r['Barcode'].'</div></td>
        <td><div  style="width:150px; text-align:center">'.$r['Product_Name'].'</div></td>
        <td><div  style="width:200px; text-align:center">'.$r['Supplier_Number'].'</div></td>
        <td><div  style="width:200px; text-align:center">'.$r['Stock_Number'].'</div></td>';
        $sql_stk="SELECT Stock_Name FROM stock where Stock_Number='".$r['Stock_Number']."'";
        $stks = db_query($database_name, $sql_stk);
        //var_dump($stks );
            foreach ($stks as $stk=>$s){
                echo'   <td style="text-align:center; width:120px; ">'.$s['Stock_Name'].'</td>';
            }
        echo'<td style="text-align:center; width:120px; ">'.$r['Purchasing_Price'].'</td>
        <td style="text-align:center; width:120px; ">'.$r['Selling_Price'].'</td>
        <td style="text-align:center; width:120px; ">'.$r['Quantity'].'</td>';
         echo'</tr>
         <tr><td colspan="10"><div id="detail-'.$pdt.'" >
         <div id="tabs-'.$pdt.'">
              <ul>
                <li><a href="#tabs-1">Sales Detail</a></li>
                <li><a href="#tabs-2">Purchases Detail</a></li>
              </ul>
              <div id="tabs-1">
                <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. </p>
              </div>
              <div id="tabs-2">
                <p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra massa metus id nunc. Duis scelerisque molestie turpis. Sed fringilla, massa eget luctus malesuada, metus eros molestie lectus,</p>
              </div>
        </div>

    </div>';

}

因此，对于每个产品，我都有一个特定的选项卡，其中包含引用该产品的信息。

 <script>
  $(function() {
    $( "#tabs" ).tabs();
  });
  </script>

如何使用Jquery调用每个产品的每个标签？
谢谢你的帮助

Answer 1

我找到了解决方案：

＆＃13;

<script>
$(document).ready(function() 
{
	 $('[id^="detail-"]').hide();
	  
				$('[id^="plus-"]').click(function() {
					alert('ALLAH');
					  var id = $(this).attr('id');
					 
					   var idx=id.substring(id.lastIndexOf("-"));
					    
						$("#detail"+idx).toggle(500); 
						$( "#tab"+idx ).tabs();						
				});
			});

			</script>

＆＃13;

和：

<div id="tab-'.$pdt.'">
              <ul>
                <li><a href="#tabs-1">Sales Detail</a></li>
                <li><a href="#tabs-2">Purchases Detail</a></li>
              </ul>

使用Jquery增加选项卡

1 个答案: