使用Jquery选择器添加HTML标记

Question

我有一个带有段落和联系表单的HTML。当浏览器禁用JavaScript时，我想显示联系表单和文本段落。

否则，我想显示联系人按钮，哪些用户可以点击并显示表单。

Answer 1

如果启用javascript，默认隐藏表单，并显示该按钮设置按钮的风格display:none;

。

然后当他们点击联系人按钮时，显示它。

$(document).ready(function(){ 
    $("#buttonID").show(); 
    $("#formID").hide(); 
    $("#buttonID").click(function(){ 
    $("#formID").show(); 
    }); 
}); 

Answer 2

<span id="formAndParagraph"> 
    <p id="Paragraph">lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p> 
    <form id="Contact"> 
     Name: <input type="text"><br> 
     Comment: <input type="text"><br> 
    </form> 
</span> 
<input type="button" id="Button" value="Click me" onclick="$('#formAndParagraph').show();" style="display:none"> 
<script> 
$('#formAndParagraph').hide(); 
$('#Button').show(); 
</script> 

jsFiddle here

Answer 3

好:)因此，这里是我的解决方案：

http://jsfiddle.net/tracyfu/Sj5cy/

下面是它做什么：

1. 我设置#contact-button css到display: none;，以便它自动隐藏是否存在JS。这样，如果JS被禁用，该按钮不会显示出来。
2. 在JS中，我显示#contact-button，然后我隐藏#contact-form。 JQuery只有在JS被启用的情况下才能工作，所以它会显示按钮并隐藏具有JS的人的表单。对于JS禁用的人员，表单不会受到影响，并且会像往常一样显示。
3. 我在按钮上添加了一个click事件来显示表单。

该解决方案的目标是，如果禁用JS，则不会有按钮。