Skip to content

Convert JS to autoload

Currently I use

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>   
<script type="text/javascript">
$(document).ready(function(){
    $("button").click(function(){
    $("#output").load("https://somesite.com/Search.html");
    });
});
</script>
<body>
    <div class="formClass">
        <div id="output">
        </div>
        <button type="button">Search</button>
    </div>

to implement an offsite html into my current page. Howevee this way, the visitor is required to press the “Search” button to reveal the content.

Is there a way to ‘automatically’ load this, without user interaction ? (I know a way to trigger the button at siteload, but I’d rather have the button not be there in the first place)

Answer

Move the load call out of the click event listener:

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>   
<script type="text/javascript">
$(document).ready(function(){
    $("#output").load("https://somesite.com/Search.html");
});
</script>
<body>
    <div class="formClass">
        <div id="output">
        </div>
        <button type="button">Search</button>
    </div>