Javascript 在jQuery中使用.toggle()方法时,代码无法正确工作

Javascript 在jQuery中使用.toggle()方法时,代码无法正确工作,javascript,jquery,html,Javascript,Jquery,Html,所以我有这个问题,使用toggle()。问题是,当我使用“切换”而不是在重新加载后单击块滑离页面时,我甚至无法切换块。 这是密码 如果我改为使用.click(),它会工作,但是如果我写“toggle”,当我重新加载页面时,块就会滑走,而我没有切换自己的权限 电子邮件输入页 $(文档).ready(函数($){ $('#newdiv')。on('toggle',function(){ $(this.css)({ '背景':'黑色', “颜色”:“白色” }); },函数(){ $(this.c

所以我有这个问题,使用toggle()。问题是,当我使用“切换”而不是在重新加载后单击块滑离页面时,我甚至无法切换块。 这是密码

如果我改为使用.click(),它会工作,但是如果我写“toggle”,当我重新加载页面时,块就会滑走,而我没有切换自己的权限


电子邮件输入页
$(文档).ready(函数($){
$('#newdiv')。on('toggle',function(){
$(this.css)({
'背景':'黑色',
“颜色”:“白色”
});
},函数(){
$(this.css)({
'背景':'绿色',
“颜色”:“红色”
});
/!*每次*甚至*单击元素时都要做的事情*/
});
});
测试某物的测试div

我在这里发现了两个问题:

1) 不能将脚本源和脚本代码放在同一标记下
我将
删除到

2) 您可以在
上收听切换事件,而不是

我希望这对你有帮助。 请参见下面的代码段:

电子邮件输入页
$(文档).ready(函数($){
$('#newdiv')。on('toggle',function(){
$(this.css)({
'背景':'黑色',
“颜色”:“白色”
});
},函数(){
$(this.css)({
'背景':'绿色',
“颜色”:“红色”
});/!*每次*甚至*单击元素时要做的事情*/
});
});
测试某物的测试div
这里是另一个带有切换的代码示例,它不起作用。问题是,它必须在块“formHide”下隐藏/显示表单,更改块中的文本,但使用编写的方法.toggle()来编写代码,只在重新加载时隐藏块,而不允许切换自身。
电子邮件输入页
$('#formHide')。切换(函数(){
$(‘我的表格’)。淡出(10000);
$(this.text('expand form');
},函数(){
$(‘我的表格’)。法登(5000);
$(this.text('colapse form');
});
凹形
附加选项
你需要什么?

掌舵 背包 穿 保险

对 不 型号: 第一个值(选项) 第二个值(选项) 第三价值观(期权) 第四值(选项) 天: 1. 2. 您的电子邮件:

你的欲望:


toggle(fn,fn)
在1.8中被弃用,后来被删除了1.9是的,谢谢,但这并不是我想要的。实际上,我的.js文件与html分开了,所以将代码组合成一个文件粘贴到这里只是我的一个错误。我想要的是切换bg和字体颜色几次,就像我单击一次-块漆成黑色,单击第二次-块是绿色,等等。我可以使用点击偶数-黑色,点击奇数-绿色,但想使用切换方法。这不是为了隐藏一些酒吧,只是改变它的颜色。这里是另一个例子,这是不正确的工作
 Here is another example of code with toggle, that does not work. the thing is that it has to hide/show the form below the block "formHide", changing the text in it the block, but insted with method .toggle() written to code the block just hides on the reload not giving to toggle itself.


<!DOCTYPE HTML>

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


            <meta charset="UTF-8"/>
            <title>Email input page</title>
            <link href="css/styles.css" rel="stylesheet" type="text/css"/>

            <script type="text/javascript" >
    $('#formHide').toggle(function(){
            $('#my_form').fadeOut(10000);
            $(this).text('expand form');
        }, function () {
            $('#my_form').fadeIn(5000);
            $(this).text('colapse form');
        });
    </script>
        </head>
        <body>
        <div id="formHide">colapse form</div>

                    <form action="form.php" id="my_form">
                        <div id="bigform">
                            <fieldset>

                                <div id="div_form_ 1">
                                    <fieldset id="innerfieldset">
                                        <legend>addition options</legend>
                                        <p><strong>You need?</strong></p>
                                        <div id="format">
                                            <input type="checkbox" value="sh" name="dop_oprions" id="shlem" />
                                            <label for="shlem">Helm</label>
                                            <input type="checkbox" value="bag" name="dop_oprions" id="bag" />
                                            <label for="bag">Backpack</label>
                                            <input type="checkbox" value="od" name="dop_oprions" id="od" />
                                            <label for="od">Wear</label>
                                        </div>
                                        <p><strong>insurance</strong></p>
                                        <div id="radio">
                                            <input type="radio" id="inch_yes" value="yes" name="inch" />
                                            <label for="inch">Yes</label>
                                            <input type="radio" id="inch_no" value="no" name="inch" />
                                            <label for="inch">No</label>
                                        </div>
                                    </fieldset>
                                    <input type="submit" value="Send" id="my_button" />
                                </div>

                                <div id="div_form_2">
                                    <span>Model:</span>
                                    <select name="moto" size="1" id="motoSelect">
                                        <option value="1">FIrst value(options)</option>
                                        <option value="2">Second value(options)</option>
                                        <option value="3">Third value(options)</option>
                                        <option value="4">Fourth value(options)</option>
                                    </select>
                                    <span>Days:</span>
                                    <select name="days" size="1" id="daysSelect">
                                        <option value="1">1</option>
                                        <option value="2">2</option>
                                    </select>
                                    <p><strong>Your email:</strong></p>
                                    <input type="text" id="email" value="Example: you@site.ru" /> 
                                    <p><strong>Your desires:</strong></p>
                                    <textarea cols="45" rows="2" id="mytextarea"></textarea>
                                </div>
                            </fieldset>
                        </div>
                    </form>
        </body>
    </html>