Jump to content
Nic727

2 Javascript questions

Recommended Posts

Hi,

 

I didn't want to create two topics, so here are my two questions regarding Javascript.

 

1. I use the same Javascript file for all my pages. The problem is that I get some errors on some page because I don't use X script. Is it possible to make a script activating only when on a specific page like if page name is XX, load this code?

 

2. I have a code working when between <script> on my HTML page, but when adding the code in my JS file, it doesn't work. What should I do to make the code working from the file?

 

Thank you

Edited by Nic727

Share this post


Link to post
Share on other sites

You can do whatever you'd like to do.  You can check the URL if you want, or probably better you can check for the presence of specific elements on the page to decide what the code should do.

I have a code working when between <script> on my HTML page, but when adding the code in my JS file, it doesn't work. What should I do to make the code working from the file?

If the code depends on elements on the page being there, then you need to put it in a ready handler.

Share this post


Link to post
Share on other sites
7 hours ago, justsomeguy said:

If the code depends on elements on the page being there, then you need to put it in a ready handler.

I already have one at the beginning of my js file

$(document).ready(function(){

For some reasons, if I replace that for $(function(){ it's not working even if in the jQuery website it shows as valid code.

My code look like something like that:

$(document).ready(function(){
  
   var dateOptions = { year: 'numeric', month: 'long', day: '2-digit' };
            var exposure_feed={
    
                options:{
                    target:"exposure-feed",
                    username:null,
                    data:null,
                    fetch_url:null,
                    story_count:6,
                    show_title:!0,
                    show_subtitle:!0,
                    show_publish_date:!0,
                    cover_size_width:800,
                    cover_size_height:400,
                    format_date:function(e){
                        return e?e.toLocaleDateString('fr-CA', dateOptions):""
                    }},
    
                init:function(e){for(var o in e)e.hasOwnProperty(o)&&exposure_feed.options.hasOwnProperty(o)&&(exposure_feed.options[o]=e[o]);exposure_feed.fetch()},fetch:function(){if(null==exposure_feed.options.username)throw new Error("Missing username.");var e=new XMLHttpRequest,o="https://exposure.co/api/3/site/"+exposure_feed.options.username+"/stories";null!=exposure_feed.options.fetch_url&&(o=exposure_feed.options.fetch_url),e.open("GET",o,!0),e.send(null),e.onload=function(){exposure_feed.options.data=JSON.parse(e.response),exposure_feed.render()}},render:function(){for(var e=document.querySelector("#"+exposure_feed.options.target),o=exposure_feed.options.data,t="",s=o.site,r=0,i=o.stories.stories.length;i>r;r++)if(!(null!=exposure_feed.options.story_count&&r>+exposure_feed.options.story_count-1)){
                    var n=o.stories.stories[r];
                    t+='<div class="ex-story">',
                        t+='<a class="ex-stoy-link" rel="noopener noreferrer" target="_blank" href="'+n.urls.story_web+'" title="Link to '+n.title+" by "+s.full_name+'">',
                            t+='<div class="ex-story-img" style="background-image:url('+n.cover_photo.url+')">',
                                t+='<div class="bg-filter"></div>',
                                t+='<div class="infos-container">',
                                    t+='<div class="infos-left">',
                                        t+='<div class="infos">',
                                            0!=exposure_feed.options.show_publish_date&&(t+='<div class="blog-date travel"><h3>'+exposure_feed.options.format_date(new Date(n.published_at))+"</h3></div>"),
                                            0!=exposure_feed.options.show_title&&(t+='<div class="blog-name"><h1>'+n.title+"</h1></div>"),
                                        t+="</div>",
                                    t+="</div>",
                                    t+='<div class="infos-right">',
                                        t+='<div class="infos">',
                                            0!=exposure_feed.options.show_subtitle&&null!=n.subtitle&&(t+='<div class="blog-description">'+n.subtitle+"</div>"),
                                            t+='<div class="blog-authorname">'+s.full_name+'</div>',
                                        t+="</div>",
                                    t+="</div>", 
                                t+="</div>", 
                            t+="</div>",
                        t+="</a>",
                    t+="</div>"}e.innerHTML=t}};
    
            
            exposure_feed.init({
                'username': 'wwf', //Account username
                'story_count': 9, //Total number of stories to display (Maximum of 18)
                'show_title': true, //Show title of story
                'show_subtitle': true, //Show Sub-title of story
                'show_publish_date': true //Show publish date of story
                });
  });

and on my HTML page I have this:

<div id="exposure-feed"></div>

Share this post


Link to post
Share on other sites

IF this code causes an error because

<div id="exposure-feed"></div>

does not exist, then check if this specific elements id exists, before going any further with a if condition
 

$(document).ready(function() {

if ($('#exposure-feed')[0]) {

//rest of code

}

});

 

 

Share this post


Link to post
Share on other sites

Hmm.. Not working. Maybe it's because of this error.

 

HTML1521: Unexpected "/body>" or end of file. All open elements should be closed before the end of the document.

 

EDIT:

Ok fixed. In fact it was because of an other script that I added for another page. I think it was creating a conflict. I did add the "check if element exist" before adding the script and it now works.

I still have the unexpected end of file and I don't know why.

Edited by Nic727

Share this post


Link to post
Share on other sites

That suggests you have misplaced closing, or mismatched number of opening element tags to closing tags which is strange for html error report, it also could refer to the same and including curly braces of JavaScript code

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×