javascript - 将 html 添加到 switch 语句中

Question

我有一个在下拉菜单中使用的 switch 语句

我想在每种情况下添加 html 代码，例如链接、图像等。

index.html 中的 header 标签

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript" defer="defer">
    function showDetails(){
        var org = $("#org").attr("value");
        var div1 = $("#div1");

       switch(org)
        {
        case "1":
          div1.html("this is all about organization 1");
          break;
        case "2":
          div1.html("this is all about organization 2");
          break;
        case "3":
          div1.html("this is all about organization 3");
          break;
        default:
          div1.html("Select Organization");
        }
        $("#div2").fadeOut(300);
        div1.fadeIn(300);
    }

    function TerritoryDetails(){
        var terr = $("#terrSelect").attr("value");
        var div = $("#div2");
        div.fadeIn(300);
        $("#div1").slideUp(300); //hide organization (optional)
       switch(terr)
        {
        case "1":
          div.html("this is all about Territory 2");
          break;
        case "2":
          div.html("this is all about Territory 2");
          break;
        case "3":
          div.html("this is all about Territory 3");
          break;
        case "4":
          div.html("this is all about Territory 4");
          break;
        case "5":
          div.html("this is all about Territory 5");
          break;
        case "6":
          div.html("this is all about Territory 6");
          break;
        case "7":
          div.html("this is all about Territory 7");
          break;
        default:
          div.html("Select Territory");
        }
    }



    function cascadeSelect(parent, child){
            var childOptions = child.find('option:not(.static)');
                child.data('options',childOptions);

            parent.change(function(){
                childOptions.remove();
                child
                    .append(child.data('options').filter('.sub_' + this.value))
                    .change();
            })

            childOptions.not('.static, .sub_' + parent.val()).remove();

    }

    $(function(){
        cascadeForm = $('.cascadeTest');
        orgSelect = cascadeForm.find('.orgSelect');
        terrSelect = cascadeForm.find('.terrSelect');
        locSelect = cascadeForm.find('.locSelect');

        cascadeSelect(orgSelect, terrSelect);
        cascadeSelect(terrSelect, locSelect);
    });
</script>

完整代码在这里

http://jsfiddle.net/5tmwg/5/

我缺乏 javascript 和 jQuery 的经验

提前致谢

Answer 1

你走在正确的道路上。

这都是关于组织 1 的

例如，您可以将这些字符串替换为 html 代码

`div1.html("<p style='color:#0066cc'>this is all about organization 1<p>");`