Dynamically display the content of div using javascript

I have a few lines of code of javascript which is working fine at one place but the same code giving an error every time when js run. I am not able to understand what is the problem.
Can anyone help me out?

Error is showing that - Uncaught TypeError: Cannot read property ‘charAt’ of undefined
at change_circle

You can see the live code with error using this URL - http://www.quaeretech.com/Home
You can see the live code without any error using this URL - https://www.rxtransparent.com/
On both site js code is the same but I don’t know in 1st URL why it’s showing an error.

js code is given below …

var $=jQuery;
var intervalId;

function change_circle(id) {
	
    var current_id = id;
    var div_no = current_id.charAt(1);
    var div_no = parseInt(div_no);
    $( "#r"+div_no ).removeClass( "active",1000 ); 
    $( "#r"+div_no+"_p" ).removeClass( "show_me",1000 );
    $("#r"+div_no).css('background-image', 'none');
    var div_no = div_no+1;
    if(div_no ==7) { div_no=1;}
    $( "#r"+div_no ).addClass( "active",1000 );
    $( "#r"+div_no+"_p" ).addClass( "show_me",1000 ); 
    $("#r"+div_no).css("background-image", "url(wp-content/uploads/2018/05/r"+div_no+".png)");

}

function CF() {
    intervalId = setInterval(function() {
        var Id = jQuery('.active').attr('id');
				change_circle(Id);
    }, 13000);
}
$('.r').mouseenter(function() {
    clearInterval(intervalId);
	var item_id = $(this).attr("id");
    $(".r").removeClass('active');
	 $(".p_animation.show_me" ).removeClass("show_me");
	 $(".r").css("background-image", "none");
    $("#"+item_id).addClass('active');
	 $( "#"+item_id+"_p" ).addClass("show_me")
	 $("#"+item_id).css("background-image", "url(wp-content/uploads/2018/05/"+item_id+".png)");
}).mouseleave(function() {
    CF();
});

CF();

Hi @Praveen_Kumar_Verma, this means that the id parameter of the change_circle() function is undefined, which again suggests that there is no .active element that has an ID attribute. You might check that before calling change_circle() though, or add a guard to change_circle() itself…

function change_circle (id) {
  if (id === undefined) {
    return
  }

  // ...
}

… or check if you actually received a string…

function change_circle (id) {
  if (typeof id !== 'string') {
    return
  }

  // ...
}

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.