按下输入按钮时触发按钮

时间:2013-06-25 13:10:53

标签: javascript jquery

我在这里使用此代码:

JS Fiddle

我想要做的是当此行中的输入字段被聚焦并且点击输入按钮时触发特定行的“添加”按钮。

据我所知,这有点像这样:

$("#current").keyup(function(e) {
    if(e.keyCode == 13) {
        $("#add").submit();
    }
});

我试图让一些不同的东西工作,但这几乎是我用Javascript写的第一个代码而且我有点卡住了。谁能告诉我哪里出错了?

4 个答案:

答案 0 :(得分:5)

除了您的current ID不是唯一身份外,您还可以执行以下操作:

$(".current").keyup(function(e) {
    if (e.which == 13) {
        $(this).next("input.add").trigger("click");
    }
});

演示:http://jsfiddle.net/9sX6X/77/

(我将重复的ID更改为current

的类

答案 1 :(得分:1)

你没有id =“add”的元素 也许你想要按钮小鸡

你可以使用

$( '这')下( '添加 ')触发(' 点击');

答案 2 :(得分:1)

好吧,首先你几乎没有相同的ID元素

然后,您发布的代码就是您要找的,替换

$("#add").submit();

通过

$(this).next().click();

(但还有其他方法可以获得按钮)

    //bind a function to the "keyup" event for the element of id "current"
    $("#current").keyup(function(e) {
            // if the key pressed is 13 (code for enter)
            if(e.keyCode == 13) {
                //trigger the click event on the next element (in this cas your button)
                $(this).next().click();
            }
        });

`

答案 3 :(得分:0)

只需按照这个小提琴:http://jsfiddle.net/9sX6X/81/

详细

<form name="input" class="form">
    <fieldset>
        <h4>Requirements</h4>
        <div class="copies"></div>
        <div class="line">
            <input id="current" type="text" name="content" placeholder="Requirement" />
            <input type="button" value="Add" class="add" />
        </div>
    </fieldset>
    <fieldset>
        <h4>Qualifications</h4>
        <div class="copies"></div>
        <div class="line">
            <input id="current" type="text" name="content" placeholder="Qualification" />
            <input type="button" value="Add" class="add" />
        </div>
    </fieldset>
    <fieldset>
        <h4>Benefits</h4>
        <div class="copies"></div>
        <div class="line">
            <input id="current" type="text" name="content" placeholder="Benefit" />
            <input type="button" value="Add" class="add" />
        </div>
    <fieldset>
</form>

<script>
//latest
var maxFields = 10;

function cloneLine(line){
    var nb = 1 + $(line).siblings(".line").length;
    if (nb < 10){
        $(line).clone().insertAfter(line).find("[type=text]").val("").focus();
    }
    else{
        alert("Maximum fields number reached ! ");   
    }
}

<script>
// Listen to "add" clicks
$(document).on("click", ".add", function(e){
    // Try to clone the line 
    cloneLine($(this).parent());
})
// Listen to [enter] in <input type="text>
.on("keypress", "input[type=text]", function(e){
    // Not [enter] pressed ? Do nothing
    if (e.keyCode != 13){
        return;
    }
    // From here, [enter] was pressed

    // Prevent form submission
    e.preventDefault();    

    // Try to clone the line 
    cloneLine($(this).parent());   
});
</script>