在下拉菜单选项下显示文本

时间:2017-02-05 06:01:56

标签: html css html5

我想在下拉选择选项下面显示一个简单的文本字符串。计划是在有人从下拉列表中选择一个位置后,可以复制代码。如果他们在下拉菜单中选择“加拿大”,在它下面会显示一个副本和可链接的链接,他们可以在他们的网站上发布链接回我的。

我希望我能够以尽可能简单的方式做到这一点,因为在编码时我绝对不是专家所以非常感谢任何帮助。

1 个答案:

答案 0 :(得分:0)

你可以使用这个并在contentText上添加一个href链接,这样它就会在你选择的下拉列表中触发

function ChangeText()
                        {
                          var contentText;
                          var selectedITem='';
                        var parm = document.getElementById("mySelection");
                          selectedITem =parm.options[parm.selectedIndex].text;
                          if(selectedITem == 'Canada')
                            contentText = '<a href="#">Canada</a>'
                         else  if(selectedITem == 'Philippines')
                            contentText = '<a href="#">Philippines</a>'
                         else  if(selectedITem == 'USA')
                            contentText = '<a href="#">USA</a>'   
                          
                          
    str=contentText;
     $("#test").html(str);
                          

                        }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
                                                
             <select id="mySelection" onchange="ChangeText();" style="width: 100%;">
               
             <option disabled="disabled"   selected="selected">Select method</option>
                  <option value="1">Canada</option>
                  <option value="2">Philippines</option>
                  <option value="3">USA</option>
                   </select>
                  &nbsp;&nbsp;&nbsp;
          
          <div  id="test"> 
             
          </div>