javascript - php陣列遍歷問題，js問題，主要是點選產品縮圖，進行點擊事件發大，

php数组遍历问题，js问题，主要是点击产品缩略图，进行点击事件发大，

现在是点击第一张图和下面几张图都是现实第一张放大图
代码如下
{foreach from=$goods_list item=goods}

<code>        <tr>
            <td style="width: 10%;font-size: 16px;border-bottom:1px solid #ccc;"><a name='fff' href='javascript:void(0);' onclick='picBig();'><img style="width:50px;height: 50px;" src="{$goods.original_img}"/></a></td></code>

<code>           <a href="javascript:void(0);" onclick="picClose();"> <img src="{$goods.original_img}" /></a>

        </div></code>

回复内容：

php数组遍历问题，js问题，主要是点击产品缩略图，进行点击事件发大，

现在是点击第一张图和下面几张图都是现实第一张放大图
代码如下
{foreach from=$goods_list item=goods}

<code>        <tr>
            <td style="width: 10%;font-size: 16px;border-bottom:1px solid #ccc;"><a name='fff' href='javascript:void(0);' onclick='picBig();'><img style="width:50px;height: 50px;" src="{$goods.original_img}"/></a></td></code>

<code>           <a href="javascript:void(0);" onclick="picClose();"> <img src="{$goods.original_img}" /></a>

        </div></code>

把你的 picBig 代码替换一下

<code>function picBig() {
    var $ = document.querySelector.bind(document);
    var img = event.currentTarget.children[0]; // 获取当前点击的图片
    var url = img.getAttribute('src'); // 获取当前点击的图片地址
    // 获取大图 img 元素并设置要显示的图片地址
    $('#divCenter > a > img').setAttribute('src', url);
    // 显示预览框
    $('#divCenter').style['display'] = 'block';
}</code>

相關標籤：

javascript php

來源：php.cn

上一篇：依照thinkphp官方文件做了 thinkphp表單令牌 請問該怎麼測試其作用 下一篇：詳解App訊息提示後台如何處理

本網站聲明

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

作者最新文章

• 貝萊德將比特幣標記為獨特的多元化工具
  2024-09-20 15:51:33
• Internet Computer (ICP) Price Prediction: Will ICP Price Hit $24?
  2024-09-20 15:47:32
• 世界幣 (WLD) 價格預測 2022-23
  2024-09-20 15:45:32
• Top Meme Coins to Invest In Today
  2024-09-20 15:39:32
• Floki (FLOKI) Price Prediction: Will the Revamped Marketing Help Floki Catch Up on October Gains?
  2024-09-20 15:38:32
• Next Cryptocurrency to Explode: 5 Coins to Add to Your Watchlist
  2024-09-20 15:27:32
• Dogecoin: From an Internet Meme to a Digital Currency with a Billion-Dollar Market Capitalization
  2024-09-20 15:26:32
• ZChains 推出一系列令人興奮的更新和發布，以增強其生態系統
  2024-09-20 15:12:32
• 如何下载小狐狸支付平台的Apple版本
  2024-09-20 14:53:01
• 新手如何在MetaMask进行交易及优缺点
  2024-09-20 14:51:01

最新問題

僅 CSS 方法可在單擊時動態修改圖片 src，無需使用 JavaScript 我需要僅使用css更改滑鼠單擊時圖像的src喜歡img:active{}

來自於 2024-04-06 19:25:49

0

1

505

放大 d3.js 時散佈圖點不會保持值 這是我第一次使用d3.js，所以請耐心等待。我在vue.js檔案中將其作為純JavaScript實作。我正在嘗試製作具有縮放功能的散點圖。到目前為止，我幾乎一切正常，但當我縮放時，...

來自於 2024-04-06 18:16:26

0

1

403

供應商特定偽元素上的 JavaScript 懸停事件 我有以下htmlinput標籤。 $("input[type='range']::-webkit-slider-thumb").on('hover',funct...

來自於 2024-04-06 15:35:24

0

1

274

使用 Javascript / Jquery 提交表單且不含按鈕 我試圖透過呼叫JavaScript函數並使用JQUERY/PHP執行表單來提交沒有按鈕的表單。我希望表單在後端靜默執行，而無需重新載入頁面。不幸的是，它不斷傳回JavaScript...

來自於 2024-04-06 14:54:03

0

2

421

使用「折疊顯示器」類別自訂 Bootstrap 手風琴標題的外觀 我想設定具有類別collapseshow的面板的卡片標題樣式。在此範例中，它是第一個面板。我嘗試使用CSS來使用.accordion.card.card-headerbutton....

來自於 2024-04-06 12:53:11

0

1

376

相關專題

更多>

• js取得數組長度的方法
• js刷新當前頁面
• js四捨五入
• php檔案怎麼打開
• js刪除節點的方法
• JavaScript轉義字符
• js產生隨機數的方法
• 如何啟用JavaScript