禁用JavaScript时使隐藏的div可见

Question

I currently have a div in my HTML that is initially hidden (using display:none ).

<div class="fulladdress">
   <p>Only display the contents of this div when an element is clicked!</p>
</div>

I then use the following Javascript so when the .autocompleteitem item is clicked, it displays:

$(document).ready(function() {

    $(document).on('click','.autocompleteitem:not(.autocompleteitemwithcontainer)',function(){
        $("div.fulladdress").show();
    });
});

However , if Javascript is disabled, the full address will never display. How do I resolve this?

Answer 1

Maybe try working with the tag <noscript> . It runs the code inside it if the javascript is disabled.

Answer 2

Use following HTML code. Now user can see the div when javaScript disabled by user or device not support javaScript. You can customize your div by select .fulladdress class on CSS.

 <noscript>
     <div class="fulladdress">
        <p>Only display the contents of this div when an element is clicked!
        </p>
     </div>
</noscript>

Answer 3

You can try something like this.

If javascript enabled - Hide div on document ready and then show on click event

If javascript disabled your document ready function wont execute and it wont hide the div

 $(document).ready(function() { $("div.fulladdress").hide(); $("#button").on('click',function(){ $("div.fulladdress").show(); }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="fulladdress"> <p>Only display the contents of this div when an element is clicked!</p> </div> <div class="button"> <button id="button">display</button> </div> 

Answer 4

Try this

<noscript>
    <style type="text/css">
        .pagecontainer {display:none;}
    </style>
    <div class="noscriptmsg">
    You don't have javascript enabled.
    </div>
</noscript>

Answer 5

If you absolutely have to have your div hidden at first even with JavaScript disabled and only then revealed, then there are some ways to deal with it.

• You can detect if JavaScript is disabled and request the user to enable it, and not show the page unless the user does so. How to detect if JavaScript is disabled?

• You can use CSS properties to show/hide .fulladdress on hover instead of on a click (you might want to modify your div for that, or put it inside a <noscript> tag).

• You might want to use 'hacks' to detect a click without using JavaScript. Here are a few examples:
  Show / hide div on click with CSS
  What is the simplest way to implement pure css show/hide?

Hope this helps!