使用jQuery实现切换,但我遗漏了一些东西

时间:2015-07-17 15:20:49

标签: javascript jquery html

我正在尝试使用不同的变量答案制作二次函数的在线计算器。我这样做是为了通过使用一个ID输入和四个函数来控制各种切换来消除好奇,但是我只是输入A来显示它。当我对b执行完全相同的操作并更改其条件ID时,它的行为类似于A,其行为与A完全相同。

这是HTML部分,我使用jQuery来切换效果以显示一些但不是所有输入。

<div class="left">
    <ul class="nav"><h3>Menu and Solve tabs</h3>        
        <li><a href="#" onclick="what();" id="togglesolve">Toggle Solve Menu</a></li>
        <li><a href="#" onclick="solveA();" id="solve">Solve A</a></li>
        <li><a href="#" onclick="solveB();" id="solve">Solve B</a></li>
        <li><a href="#" onclick="solveC();" id="solve">Solve C</a></li>
        <li><a href="#" onclick="solveX();" id="solve">Solve X</a></li>
        <li><a href="#" onclick="how();" id="togglehow">How to solve</a></li>
        <li><a href="MathApp_Home.html">Return Home</a></li>
    </ul>
</div>
<div class="content"><h3>This is where to insert your numbers.</h3>
    <ul class="nav" name="quad"><p>Quadratic formula:<br /> ax^2+bx+c=0</p><br />
        <li><p>The formula you are solving for is:<br /><spam id="formula"></spam></p></li>
        <li><p id="a">Input A:</p><input class="input" name="a" id="a"/></li>
        <li><p id="b">Input B:</p><input class="input" name="b" id="b"/></li>
        <li><p id="c">Input C:</p><input class="input" name="c" id="c"/></li>
        <li><p id="x">Input X:</p><input class="input" name="d" id="x"/></li>
        <br />
        <li><p>Answer 1 to variable<spam id="variableinputalpha"></spam><br /><spam id="answer"></spam></p></li>
        <li><p>Answer 2 to variable<spam id="variableinputbeta"></spam><br /><spam id="answer2"></spam></p></li>
    </ul>
</div>

这是jQuery:

$(document).ready(function(){
    $("a#togglesolve").click(function what(){
        $("a#solve").toggle(1000);
    });
    $("a#togglehow").click(function how(){
        $("#howto").toggle(1000);
    });
    $("#solve").click(function solveA(){
        $("#a, p#a").hide(1000)
        $("#b, #c, #x, p#b, p#c, p#x").show(1000);
    });
    $("solve").click(function solveB(){
        $("#b, p#b").hide(1000)
        $("#a, #c, #x, p#a, p#c, p#x").show(1000);
    });
});

有没有办法制作数组或使函数与选择器不同?如果我提出错误的问题,请告诉我。还在学习,谢谢你的帮助!

1 个答案:

答案 0 :(得分:0)

当我调查&#34;未定义的部分&#34;我有关于javascript和jquery的公式,一些onclick函数只是jquery,它看起来是&#34; undefined&#34;因为javascript中没有定义特定的功能,使其看起来有错误。使用jQuery进行切换比使用java进行切换要容易得多(这是我个人认为的,并且每个人都有权发表意见)

因此,如果是外部文件,我会在每个部分对Jquery和Javascripts进行排序。

我使用切换来隐藏P和&#34; a&#34;属性和显示所述属性,但我发现更容易做按钮而不是链接,如:

<a href="#" onclick="blah();"></a>

并转到

<button onclick="blah();"></button>

这允许我直接使用onclick事件,并且没有href一个容易引起问题的空白路径,例如病毒等。某些函数在javascript中是惰性的但在jquery中是活动的。

如果有不同的方法知道!