ด้วยสํานึกในพระมหากรุณาธิคุณสมเด็จพระนางเจ้าสิริกิติ์เป็นล้นพ้นอันหาที่สุดมิได้
ด้วยสํานึกในพระมหากรุณาธิคุณสมเด็จพระนางเจ้าสิริกิติ์เป็นล้นพ้นอันหาที่สุดมิได้


สอบถามการนำข้อมูลจากการ append ไปใส่ในตัว carousel (ต่อจากกระทู้ที่เเล้ว)

ถาม-ตอบ แนะนำไอเดีย โค้ดตัวอย่าง แนวทาง วิธีแก้ปัญหา สอบถามการนำข้อมูลจากการ append ไปใส่ในตัว carousel (ต่อจากกระทู้ที่เเล้ว)

ปัจจุบัน นักพัฒนาสามารถ ใช้ ChatGPT | Gemini | Claude | Perplexity | Deepseek ช่วยในการแก้ไขปัญหาต่างๆ ในการเขียนโปรแกรม หรือหาข้อมูลเพิ่มเติมได้ง่ายและสะดวก แนะนำให้ทุกคนใช้งานเพื่อพัฒนาศักยภาพของตัวเอง

สอบถามการนำข้อมูลจากการ append ไปใส่ในตัว carousel (ต่อจากกระทู้ที่เเล้ว)
หลังจากผมได้มีการกำหนด DOM Element ให้เสร็จก่อนที่จะเข้าไปใช้ตัว plugin ของ carousel ปรากฏว่า เมื่อมีการ click ปุ่มส่งค่าครั้งเเรก ตัว carousel สามารถทำงานได้อย่างปกติครับ เเต่เมื่อผมทำการกดให้มีการส่งค่าเป็นครั้ง ที่ 2 ตัว carousel กลับไม่ทำงาน ต้องเเก้ไขอย่างไรครับ process การทำงานทั้งหมด จะไม่มีการ รีเฟส หน้าจอนะครับ จะใช้เป็นตัว jquery กับ javascript ในการดพเนินงาน

ไฟล์หน้า index
<div id="divBuy" class="hide fadeInRight ">  
    <div class="sticky-top sticky-buyer p-1" style="background: #ffffff;"> 
        <button type="button" class="close" aria-label="Close" onclick="$('#divBuy').toggle();">
            <span aria-hidden="true">&times;</span>
        </button> 
    </div> 
    <div class=""> 
        <?php
        include("popup.php");
        ?>
    </div> 
</div>


<ul class="nav flex-column">
    <li class=""> 
        <a class="" onclick="byg_replace(m_<?php echo $v['ID']; ?>);$('#divBuy').toggle();">
<i class="fas fa-buy"></i><br> Detail</a>
    </li>
</ul>

//ผมได้นำค่า json_encode เก็บไว้ที่ตัวเเปร m_ นะครับ
<script>
    function byg_replace(data) {
        var md = data;
        var i;
        $(".owl-carousel.sec").html('');
        var txt = "";
        for (i = 0; i < md.mod.length; i++) {
            var mv = md.mod[i];
            var txt = ' <div class="item news-post standard-post">
<div class="d-flex flex-row w-100 pb-0"><img src="' + mv.pic + '" > </div></div>';
            $('.owl-carousel.sec').append(txt);
        }

        $('.owl-carousel').owlCarousel({
            loop: true,
            margin: 10,
            nav: false,
            autoplay: true,
            autoplayTimeout: 2000,
            autoplayHoverPause: true,
            responsive: {
                0: {
                    items: 1
                },
                600: {
                    items: 3
                },
                1000: {
                    items: 5
                }
            }
        });
    }
</script>

ไฟล์หน้า popup

<div class="owl-carousel sec">

</div>




Antinew007 22-09-2020 23:01:41

คำแนะนำ และการใช้งาน

สมาชิก กรุณา ล็อกอินเข้าระบบ เพื่อตั้งคำถามใหม่ หรือ ตอบคำถาม สมาชิกใหม่ สมัครสมาชิกได้ที่ สมัครสมาชิก


  • ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ
  • CAPTCHA Image
    Play CAPTCHA Audio
    Refresh Image


    ( หรือ เข้าใช้งานผ่าน Social Login )

 ความคิดเห็นที่ 1
คลิกขวาดูโค้ดแนวทางจาก demo คำถามที่แล้ว


ninenik 23-09-2020






เว็บไซต์ของเราให้บริการเนื้อหาบทความสำหรับนักพัฒนา โดยพึ่งพารายได้เล็กน้อยจากการแสดงโฆษณา โปรดสนับสนุนเว็บไซต์ของเราด้วยการปิดการใช้งานตัวปิดกั้นโฆษณา (Disable Ads Blocker) ขอบคุณครับ