Strange behavior with jquery method and debug line by line [Chrome ver. 51]
38 views
Skip to first unread message
Marco De Rosa
May 30, 2016, 10:25:43 AM5/30/16
to Google Chrome Developer Tools
Hi,
Finally I click on F10 and debugger instead to break at console.log, executes everything and the js script ends.
I have noticed a strange behavior in Chrome debug when I use 'step over next function' (F10) while a jquery method is executed.
For example I have this simple html code:
For example I have this simple html code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=">
<title>Title</title>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#myselect').on('change', function() {
test();
});
});
function test() {
var currentText = $("#myselect option:selected").text();
console.log(currentText);
}
</script>
</head>
<body>
<select id="myselect">
<option value="0">--</option>
<option value="1">val 1</option>
<option value="2">val 2</option>
<option value="3">val 3</option>
</select>
</body>
</html>I insert a breakpoint in the first line of test function.
When I change the dropdownlist, chrome breaks at this line but highlights in blue, only text method:
When I change the dropdownlist, chrome breaks at this line but highlights in blue, only text method:
then I click on F10 and debug highlights $("#myselect option:selected").text() but currentText is always undefined:
Finally I click on F10 and debugger instead to break at console.log, executes everything and the js script ends.
In the console I get the right value of the dropdownlist but the question is: why chrome behaves so strangely, in front of a simple jquery method?
Reply all
Reply to author
Forward
0 new messages