组合按键并单击

时间:2018-11-03 16:45:07

标签: javascript events add

有些帖子提到了这个问题,但是在J Query中我还没有学到。我一直试图在用户单击屏幕或键盘后添加该项目。当用户单击屏幕时,似乎工作正常,但是当用户在键盘上按Enter键时,项目显示的时间少于一毫秒,然后消失。另外,如果您可以提及我如何添加删除功能以删除用户单击的项目。 这是HTML:

<!DOCTYPE html>
<html>
<head>
    <title>Simple Shopping Cart</title>
    <link rel="stylesheet" type="text/css" href="index.css">
</head>
<body>
    <p class="buy">Buy your items anywhere and anytime</p>
    <p class="click">click on an item to remove it</p>
    <form>
        <input type="text" class="item" placeholder="Item:">
        <button type="button">Add item</button>
    </form>
    <br>
    <ul>

    </ul>
<script type="text/javascript" src="index.js"></script>
</body>
</html>

这是JavaScript:

const input = document.querySelector(".item");
const btn = document.querySelector("button");
const ul = document.querySelector("ul");

function inputLength() {
    return input.value.length;
}
function add() {
    var li = document.createElement("li");
    li.appendChild(document.createTextNode(input.value));
    ul.appendChild(li);
}
function addItem() {
    if (inputLength() > 0) {
        add();
    }
}
function addItemPress(event) {
    if (inputLength() > 0 && event.which === 13) {
        add();
    }
}
btn.addEventListener("click", addItem);
input.addEventListener("keypress", addItemPress)

1 个答案:

答案 0 :(得分:0)

默认情况下,除非将action属性设置为“#”,否则表单将在提交表单时重置页面。要在提交表单时运行JavaScript,可以使用onSubmit属性。这些方法可以像这样组合:

index.html:

#include <stdio.h>
#include <stdbool.h>

int mcd(int a, int b)
{
    if(b == 0)
        return a;
    else
        return mcd(b, a % b);
}

int valuta(int val, int h, int previous )
{
    return ( mcd(val, h) && h > previous ) ? h : previous ;
}

int main()
{
    int val, x, t ;
    printf( "Enter value:") ;
    scanf("%d", &val);

    typedef enum 
    {
        EVEN = 0,
        ODD = 1,
        UNDEFINED
    } eOddEven ;

    eOddEven expect = UNDEFINED ;
    bool sequence_valid = true ;

    printf( "Enter sequence in odd/even or even/odd order (break sequence to exit):\n") ;
    while( sequence_valid )
    {
        scanf("%d", &x);
        if( expect == UNDEFINED )
        {
            // Sequence order determined by first value
            expect = (x & 1) == 0 ? EVEN : ODD ;
        }
        else
        {
            // Switch expected odd/even
            expect = (expect == ODD) ? EVEN : ODD ;

            // Is new value in the expected sequence?
            sequence_valid = (expect == ((x & 1) == 0 ? EVEN : ODD)) ;
        }

        //  If the sequence is valid...
        if( sequence_valid )
        {
           // Test if input is largest qualifying value
           t = valuta( val, x, t ) ;
        }
    }

    // Result
    printf("Result: %d\n", t);

    return 0;
}

index.js:

<!DOCTYPE html>
<html>
<head>
    <title>Simple Shopping Cart</title>
    <link rel="stylesheet" type="text/css" href="index.css">
</head>
<body>
    <p class="buy">Buy your items anywhere and anytime</p>
    <p class="click">click on an item to remove it</p>
    <form id="addItemForm" action="#" onsubmit="add()">
        <input type="text" class="item" placeholder="Item:">
        <button type="submit">Add item</button>
    </form>
    <br>
    <ul>

    </ul>
<script type="text/javascript" src="index.js"></script>
</body>
</html>