Question

我的网站上有一些图片，点击后会显示“.TutorialsSlideDown”div，同时会隐藏“.tutorial_listing”div。我想向这些图像添加数据属性，然后检查单击哪一个，并根据使用我的数据库中的数据填充“.TutorialsSlideDown”div。

这可以这样做吗？怎么样？如果没有，最好的方法是什么？

HTML：

 <div class="tutorial_listing">
        <img id="PhpTutorials" src="~/Images/PHP.png" width="150px" height="150px" alt="PHP Tutorialok"/>
        <img id="AspdotNetWPTutorials" src="~/Images/ASPdotNet.png" width="150px" height="150px" alt="ASP.NET Tutorialok"/>
    </div>
    <div class="tutorial_listing"><h3>Programozás</h3></div>
    <div class="TutorialsSlideDown"></div>

jQuery的：

$('#PhpTutorials').click(function () { openTutorials("PHP Tutorialok. <a class='GoBack'>Vissza</a>") });
    $('#AspdotNetWPTutorials').click(function () { openTutorials("ASP.NET Web Pages Tutorialok. <a class='GoBack'>Vissza</a>") });

    function openTutorials(title) {

        $('.tutorial_listing').slideUp(400);
        $('.TutorialsSlideDown').slideDown(400);
        $('#PageTitle').html(title);
        $('.GoBack').bind('click', function () {
            $('.TutorialsSlideDown').slideUp(400);
            $('.tutorial_listing').slideDown(400);
            $('#PageTitle').html("Tutorialok");
        });

        return false;
    }

Answer 1

在函数中添加一个额外的变量，该函数具有数据库中教程的ID
对服务器端脚本进行ajax调用，该脚本可以处理get / post并获取ID
查询数据库并获取所需信息
返回数据并使用jQuery

我认为为您编写整个代码并不是很有意义。这是一个指导，应该推动你朝着正确的方向。如果您有任何其他问题，请与我们联系。

你可以在这里阅读jQuery ajax：

http://api.jquery.com/jQuery.ajax/

jQuery - 动态添加数据值并从数据库中检索数据

1 个答案: