Firefox event.clientX not functioning - javascript

I'm working on a d3 and js project.
The beginning of the function looks like:
$(document).ready(function() {
d3.select("#aid").select(".abutton").on("mousemove",function() {
afile.style("top", (event.clientY+10)+"px").style("left",(event.clientX+15)+"px");
afile.html("<h3>Click text here</p><p>or here</p>");
});
I've done quite a bit of Googling!
The essence is that on mouseover, it should do the function. This works in Chrome and IE because the event variable is global, and as such so are it's client* properties.
The solution, as I understand it, is to pass in an eventObject. When I do that, my code looks like:
$(document).ready(function() {
d3.select("#aid").select(".abutton").on("mousemove",function(event) {
afile.style("top", (event.clientY+10)+"px").style("left",(event.clientX+15)+"px");
afile.html("<h3>Click text here</p><p>or here</p>");
});
The Firefox log gives me:
[09:59:04.308] TypeError: event is undefined # filepathofjavascriptfile
and similarly, it breaks in Chrome:
Uncaught TypeError: Cannot read property 'clientY' of undefined filepathofjavascriptfile
(anonymous function) help.js:34
What am I doing wrong? Please let me know if you need anything else.

Try:
d3.select("#aid").select(".abutton").on("mousemove",function() {
afile.style("top", (d3.event.clientY+10)+"px").style("left",(d3.event.clientX+15)+"px");
afile.html("<h3>Click text here</p><p>or here</p>");
});
For whatever reason, that's how d3 exposes the event object.

Related

Use start? method from opal-browser

I am trying to translate this js code into ruby code
document.ontouchstart ? 'touchstart' : 'click';
I am using opal-browser to get browser functionality. My current attempt is this:
touch = Browser::Event::Touch.new
puts touch.start?
However this returns the error:
Uncaught TypeError: Cannot read property 'type' of undefined
When I checked the error trace the error seems to be coming from a missing name property in the Touch class.
Hoping Opal community can help me out here
If you want to check if touch is supported you need to call Event::Touch.supported?.
For the error, it's happening because .new expects the event object as parameter, if you want to create a new event object you need to call .construct.
In retrospect it would have probably been better to have .construct be .new, and .new be .wrap or something on that line.

Possible causes of Cannot read property constructor of undefined

I want to iterate over all the forms present in a div. So I am using the following code for this
$('#divid form').each(function (index, formDetails) {
if (formDetails) {
console.log($(formDetails).attr('id'));
}
});
This is working fine in Mozilla with no issues but when I run this code in Chrome sometimes it throws the following error.
This error is coming
Uncaught TypeError: Cannot read property 'Constructor' of undefined
I am using Version 33.0.1750.117 m of Chrome.
Why this error is coming I am not able to understand?
Sounds like you don't have jQuery included before your try and load your functions.
Wrap your javascript code inside the below function:
$(document).ready(function() {
alert('loaded');
}
Also check if the initial is $ or jQuery

Undefined variable error that shouldn't be a variable

I've made a piece of code in jquery that assigns a href attribute to a variable. Here's that code:
$('#reactions' + i).attr('href', 'javascript:comments ('+entry.url+','+i+');');
This should assign a call to the javascript function comments. Now I want to use that call on a jquery mobile button, like this:
document.write('Reactions');
But doing this gives me a in FF and Chrome. This is the error from FF±
Uncaught exception: ReferenceError: Undefined variable: i_heart_chaos_ihc_after_dark_independence_day_through_a_bullhornthis_is_what
Error thrown at line 1, column 0 in javascript:comments (i_heart_chaos_ihc_after_dark_independence_day_through_a_bullhornthis_is_what,1);:
comments (i_heart_chaos_ihc_after_dark_independence_day_through_a_bullhornthis_is_what,1);
In this, i_heart_chaos_ihc_after_dark_independence_day_through_a_bullhornthis_is_what is the value of entry.url.
I'm just not getting why this error appears, as far as I know, everything should work.
I know that there are questions looking similar to mine, but I couldn't figure out the answer. If you want to see the whole source, it's here.
Surround entry.url with quotes:
$('#reactions' + i).attr('href', 'javascript:comments ("'+entry.url+'",'+i+');');
The best way to fix the issue is to do it the "jQuery way". Instead of adding a href attribute that executes JavaScript, add a click event:
$('#reactions' + i).click( function() {
comments( entry.url, i );
});
Similarly don't use document.write() but add elements to the document using jQuery functions.

uncaught error NOT_FOUND_ERR DOM Exception 8

So I am deleting all the contents under a particular div and adding a message content. However, javascript throw the following error after the finish:
Uncaught Error: NOT_FOUND_ERR: DOM Exception 8
Here is the code where it is executed
new Ajax.Request("profileThis.php",
{
method:'post',
parameters:{title:title, review:review, userId:userId, category:category, categoryId:categoryId},
onSuccess:function(ajax)
{
alert(ajax.responseText); // this is just for debugging purposes
var message=ajax.responseText;
var divMessage=document.createElement("div");
divMessage.style.color="rgb:(105,105,105)";
divMessage.innerHTML=message;
while($("reviewSheet").hasChildNodes)
{
$("reviewSheet").removeChild($("reviewSheet").lastChild);
}
$("reviewSheet").adopt(divMessage);
},
onFailure:ajaxFailure,
onException:ajaxFailure
});
People commented that the problem was with how I assigned divMessage to reviewSheet. I tried both adopt and appendChild but none works.
A little help would be appreciated.
divMessage.style.color="rgb:(105,105,105)";
should be
divMessage.style.color="rgb(105,105,105)";
Is the problem that you are calling the method hasChildNodes() on a jQuery object? I'm not sure what $("reviewSheet") is supposed to be, but wrapping a string in $() makes it a jQuery object which I don't believe will work with regular javascript methods. If "reviewSheet" is the id of an element you could do something like
node = document.getElementById('reviewSheet');
then you could go into your while loop.
while (node.hasChildNodes()) {
//the rest of your code here
}
Oh also you need to put the parenthesis after hasChildNodes() to return a boolean value.

variable assignments using jQuery failing in Safari?

I'm using jQuery 1.3.2 and it's breaking under Safari 4 for mysterious reasons.
All of my javascript references are made right before the tag, yet with the following code:
var status = $('#status');
status.change( function(){ /* ... */ } );
The following error is displayed in the Web Inspector:
TypeError: Result of expression 'status.change' [undefined] is not a function.
However the error is not encountered if I eliminate the variable assignment attach the change method directly like so:
$('#status').change( function(){ /* ... */ } );
Why? I need to use variables for this and several other findById references because they're used many times in the script and crawling the DOM for each element every time is regarded as bad practice. It shouldn't be failing to find the element, as the javascript is loaded after everything except and .
Try changing the variable to something other than "status."
It's confusing your variable with window.status (the status bar text). When I typed var status = $('#status') into the debugging console, the statusbar changed to [Object object]. Must be a bug in Safari.
If you put the code inside a function, so that status becomes a function-local variable, it should work.
It's standard practice in jQuery to wrap things in a
$.onready(function() {
});
This makes sure the DOM is loaded before you try to manipulate it.

Categories

Resources