Question

晕

我用（CSS，HTML，JavaScript）构建了一个计算器。问题是我无法在（Form.input）上显示按钮，和（Form.Output）的答案 javascript代码应该可以工作，但它没有做任何事情。有任何建议如何解决这个问题？

＆＃13;

/* reset */
*  {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    font-size: 5vw;
}

html, body {
    width: 100%;
    margin: 0;
    padding: 0;
}


/* document */
body {
    font-family: "URW Gothic L", "Helvetica", "Arial", sans-serif;
    /* Background source:
     * http://www.texturex.com/Leather-Textures/black+leather+texture+large+close+up+grain+material+dark+fabric+stock+photo.jpg.php
     * Free offered by Free Leather Textures */
    background: url('../../../media/black-leather-texture.jpg');
}

.display {
    border: 0.2rem solid gray;
    border-radius: 0.5rem;
    background: black;
    padding: 0.5rem;
    width: 100%;
    display: block;
}
.display > output {
    display: block;
    height: 1.5rem;
    margin: 0;
    color: aqua;
}

form {
    width: 100%;
    padding: 0.5rem;
}

fieldset {
    border: none;
    margin: 0;
    font-size: 0;
}
fieldset > button {
    width: 20%;
    margin: 3.3%;
    padding: 2vw;
}
fieldset > button:nth-child(4n) {
    margin-right: 0;
}
fieldset > button:nth-child(4n+1) {
    margin-left: 0;
}

button {
    box-shadow: 0 0 0.5rem black;
    border: none;
    border-radius: 0.5rem;
    text-align: center;
    vertical-align: middle;
    margin: 0;
    font-weight: bold;
    font-size: 1.5rem;
}
output {
    font-size: 1rem;
}


button.number, button.command {
    background: white;
}
button.number:active, button.command:active {
    background: rgb(230, 230, 230);
    box-shadow: inset 0 0 0.5rem black;
}
button.operator {
    box-shadow: 0 0 0.5rem rgb(80,80, 80);
    background: black;
    color: white;
}
button.operator:active {
    background: rgb(60, 60, 60);
    box-shadow: inset 0 0 0.5rem black;
}

#key-c {
    background: red;
    color: white;
}
#key-c:active {
    background: darkred;
}
button:focus {
    box-shadow: 0 0 0.5rem deepskyblue;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Casio Mini</title>
        <link rel="stylesheet" href="styles/style.css" />
        <script src="scripts/calculator.js"></script>
    </head>
    <body>
        <form>
            <fieldset class="display">
                <output name="output" id="output" class="output"></output>
                <output name="input" id="input" class="input"></output>
            </fieldset>

            <fieldset>
                <button type="button" name="key-0" id="key-0" class="number" value="0">0</button>
                <button type="button" name="key-1" id="key-1" class="number" value="1">1</button>
                <button type="button" name="key-2" id="key-2" class="number" value="2">2</button>
                <button type="button" name="key-+" id="key-+" value="+" class="operator">&plus;</button>

                <button type="button" name="key-3" id="key-3" class="number" value="3">3</button>
                <button type="button" name="key-4" id="key-4" class="number" value="4">4</button>
                <button type="button" name="key-5" id="key-5" class="number" value="5">5</button>
                <button type="button" name="key--" id="key--" value="-" class="operator">&minus;</button>

                <button type="button" name="key-6" id="key-6" class="number" value="6">6</button>
                <button type="button" name="key-7" id="key-7" class="number" value="7">7</button>
                <button type="button" name="key-8" id="key-8" class="number" value="8">8</button>
                <button type="button" name="key-*" id="key-*" value="*" class="operator">&lowast;</button>

                <button type="button" name="key-9" id="key-9" class="number" value="9">9</button>
                <button type="button" name="key-c" id="key-c" class="command">C</button>
                <button type="button" name="key-=" id="key-=" class="command">&equals;</button>
                <button type="button" name="key-/" id="key-/" value="/" class="operator">&divide;</button>
            </fieldset>
        </form>
    </body>
</html>

＆＃13;

a<- rnorm (100, 1000, 1000)
d <- as.data.frame(a)
d <-d %>%  mutate(b=cut(a, breaks=seq(min(a),max(a), 500))) %>% 
    group_by(b) %>% summarize(count=n())
ggplot(data=d, aes(x=b, y=count)) + 
    geom_bar(stat = 'identity')+
    theme (axis.text.x=element_text(angle=90, size=5, face='bold'))

＆＃13;

Answer 1

您的代码中几乎没有问题。

这是一个工作示例：https://jsfiddle.net/871tvdrc/4/

实际上jQuery中不存在SET AUTHREC PROFILE('self') GROUP('group') OBJTYPE(QMGR) AUTHRMV(ALL) AUTHADD(CONNECT,DSP,INQ) SET AUTHREC PROFILE('SYSTEM.ADMIN.COMMAND.QUEUE') GROUP('group') OBJTYPE(QUEUE) AUTHRMV(ALL) AUTHADD(DSP,INQ,PUT) SET AUTHREC PROFILE('SYSTEM.DEFAULT.MODEL.QUEUE') GROUP('group') OBJTYPE(QUEUE) AUTHRMV(ALL) AUTHADD(DSP,INQ,GET) SET AUTHREC PROFILE('**') GROUP('group') OBJTYPE(NAMELIST) AUTHRMV(ALL) AUTHADD(DSP,INQ) SET AUTHREC PROFILE('**') GROUP('group') OBJTYPE(PROCESS) AUTHRMV(ALL) AUTHADD(DSP,INQ) SET AUTHREC PROFILE('**') GROUP('group') OBJTYPE(QUEUE) AUTHRMV(ALL) AUTHADD(DSP,INQ) SET AUTHREC PROFILE('**') GROUP('group') OBJTYPE(CHANNEL) AUTHRMV(ALL) AUTHADD(DSP) SET AUTHREC PROFILE('**') GROUP('group') OBJTYPE(CLNTCONN) AUTHRMV(ALL) AUTHADD(DSP) SET AUTHREC PROFILE('**') GROUP('group') OBJTYPE(LISTENER) AUTHRMV(ALL) AUTHADD(DSP) SET AUTHREC PROFILE('**') GROUP('group') OBJTYPE(SERVICE) AUTHRMV(ALL) AUTHADD(DSP) SET AUTHREC PROFILE('**') GROUP('group') OBJTYPE(TOPIC) AUTHRMV(ALL) AUTHADD(DSP)，它是.value();

然后你的选择者错了。

这是正确的JS：

.val()

这是正确的HTML：

$(document).ready(function() {
  $('.keys button').on('click', function() {
    var value = $(this).val();
    console.log(value);
    $('.display .input').append(value);
  });

  $('button[name="="]').on('click', function() {

  });

});

计算器输入和输出字段集

1 个答案: