Question

在表单中，我将文本框和按钮放在：

<input type="text" class="form-control" id="txtCustomerId" placeholder="Customer ID">
<span class="input-group-btn">
    <button class="btn btn-secondary" type="button" data-toggle="modal" data-target="#LovCustomer"><i class="fa fa-list"></i></button>
</span>

按下此按钮时，会弹出一个模态窗体（引导程序）。我在模态表单上放了一个按钮：

<td><button id="LSSL" value="LSSL" class="btn btn-info btn-xs"><i class="fa fa-caret-right"></i></button></td>

我在<head>中的jQuery下面：

$(function(){
    $('#LSSL').click(function(){
        $('#txtCustomerId').val($(this).val());
    });
});

我的要求是获取被按下的按钮的值（以模态形式）并将其分配给父窗体的txtCustomerId。但是当我按下按钮时，页面会刷新并且文本字段为空（因为它已刷新）。

我认为该值已分配，但由于页面已刷新，因此指定的值将消失。

我想要知道要么停止页面刷新还是其他任何方式来实现这一目标。

提前致谢。

以下是我的<head>部分供您参考：

<head>  
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" media="screen" href="http://tarruda.github.com/bootstrap-datetimepicker/assets/css/bootstrap-datetimepicker.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script>
        $(function(){
            $('button').click(function(e){
                e.preventDefault();
                var value = $(this).val();
                $('#txtCustomerId').val(value);
            });
        });
    </script>
</head>

Answer 1

你的按钮应该是这样的，

"small"

在Js部分，你可以<td><button type="button" id="LSSL" value="LSSL" class="btn btn-info btn-xs"><i class="fa fa-caret-right"></i></button></td>，

preventDefault()

Answer 2

使用 preventDefault()停止按钮的默认行为

$(function(){
   $('#LSSL').click(function(e){
       e.preventDefault();
       alert($(this).val());
   });
});

或使用

<input id="LSSL" type="button" value="Click" onclick="doSomething(this)">

function doSomething(obj) {
alert(obj.value);
}

从jQuery为文本框赋值

2 个答案: