Question

在下面的jQuery脚本中，我有一个名为toggleBool的变量和一个名为toggleBool的函数。

它起作用，除了变量toggleBool不会在每次调用toggleBool（）的按钮单击之间在true和false之间更改。如果我将变量名称更改为例如toggleBoolean，然后一切正常。另外，我正在使用alert（）进行跟踪。有没有可以让我在jQuery或javascript中插入断点的工具？

    	toggleBool = false;
    	iter_n = 0;
    	jQuery('#pResult').css(
    		{	'font-size'		:	'20px',
    			'background-color'	:	"#fff8dc"	,
    		})
    	$('#clickMe').css(
    		{	"background-color"	:	"#e9ffdb",	
    			"font-size"		:	"30px",
    			"font-family"		:	"Courier",
    			"font-style"		:	"italic",
    		})
    	jQuery('#clickMe').click(function()
    	{
    		toggleBool();
    		if (toggleBool == true)
    			$('#fColor').css('color', 'magenta');
    		else
    			$('#fColor').css('color', 'blue');
    		$('#pResult').html('You just clicked the event button ' + iter_n + '-th time!')
    		function	toggleBool()
    		{
    			iter_n++;
    			toggleBool = !toggleBool;
    		}
    	})

    	<button	id='clickMe'>Click the button to toggle color</button>
    	<h2 align=center>
    	<p>There are so many <span id='fColor' style="color:blue">colorful</span> flowers.</p>
    	</h2>
    	<p align=center id='pResult'> This is the default paragraph before click event. </p>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 1

要进行调试，请在Chrome中按F12键，然后打开调试窗口。

在行上放置一个断点

iter_n = 0;

然后在控制台中键入toggleBool，您将看到一个布尔值被打印出来。

然后在该行的clickme函数中放置一个断点

if (toggleBool == true)

然后在控制台中键入toggleBool，您将看到一个打印出来的函数。

您需要了解变量的作用域，并且toggleBool会将作用域从函数范围之外的全局变量更改为作用域，而一旦您位于clickme函数内部，则将更改范围。

具有相同名称的jQuery变量和函数

1 个答案: