0

我的网站上有一些图像，单击时会显示“ .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;
    }
4

1 回答 1

3
  1. 向数据库中具有教程 ID 的函数添加一个额外的变量
  2. 对可以处理 get/post 并获取 ID 的服务器端脚本进行 ajax 调用
  3. 查询数据库，得到你想要的信息
  4. 返回数据并使用 jQuery 将其嵌入到页面中

我认为为您编写整个代码没有多大意义。这是一个应该将您推向正确方向的指南。如果您还有其他问题，请告诉我。

您可以在此处阅读有关 jQuery ajax 的信息：

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

于 2013-02-27T10:36:08.647 回答