Question

我正在开发一个比较多种产品的网站（Link）。产品名称在一个盒子里。使用鼠标悬停我可以在框中看到他们的规格。问题是我有多个不同产品的盒子，所有规格都装在一个盒子里面。我希望有一个人可以帮助我。（这部分是荷兰语）

if($nieuws['relateditem'])
    {
        $array1 = explode(",", $nieuws['relatedoption']);
        foreach($array1 as $key2)
        {
        print_r($key2);
        }
        $content .='

        <h2>Gerelateerde producten</h2>
        <div id="product-grid">
            <div id="product-grid-inner">   
        ';

        $array = explode(",", $nieuws['relateditem']);

        $i = 0;
        $id = 0;            
        foreach($array as $key1)
        {
            $id++;
            $i++;
            $key1 = trim($key1);

            $query4x = $mysqli->query("SELECT * FROM producten WHERE productcode='".$key1."'");
            $row2x = $query4x->fetch_assoc();

            $hammer = str_replace("XXX", $row2x['id'], $hammertimePro);

            $content .='
            <div id="'.$id.'blok" class="product-grid-item3" onMouseOver="this.style.border = \'1px solid #007fff\'" onMouseOut="this.style.border = \'1px solid #CCCCCC\'">
            <h2 class="titel">'.$row2x['naam'].$hammer.'<br /></h2><br />';

    //----
                    $options2 = explode(",", $row2x['relatedoption']);

                    foreach($options2 as $option2)
                        {
                        $query2 = $mysqli->query("SELECT * FROM producten WHERE productcode = '".$option2."'");
                        while($row2 = $query2->fetch_assoc())
                                {
                                $content.= "<div onMouseOver=\"this.style.backgroundColor='#f0f0f0'; this.style.cursor='pointer'; showConc(".$row2['id'].",1)\" onMouseOut=\"this.style.backgroundColor='#ffffff';\">".substr($row2['naam'], 13, 4)."</div>";
                                }
                        }

    //---- onMouseOver='showInformation(".$prods['id'].")'

    $content.='<div id="specs"></div></div>';

        }

        $content .= '</div></div>';

    }
?>

function showConc(id,box) {

$.ajax({
    url: 'http://www.ledisvet.nl/A3/concept_prod.php',
    type: 'get',
    data: 'id='+id,

    success: function(result) {
        $('#specs').html(result);
    }
});
}

由于

Answer 1

这里有很多问题。问题是您有三个ID为specs的div。 ID必须是唯一的 - 浏览器不知道你的意思是哪个 #specs框，所以它会选择它找到的第一个。

您永远不会使用showConc()函数的第二个参数（box）。即使你这样做了，也可以将其硬编码到1：showConc(".$row2['id'].",1)。

将showConc()函数更改为以下内容：

function showConc(id,box) {
    $.ajax({

        // ... other parameters here

        success: function(result) {
            $('#specs'+box).html(result);
        }
    });
}

然后将specs ID更改为specs1，specs2和specs3，并使用正确的数字调用该函数。

鼠标悬停规范

1 个答案: