Question

我想在文本框中添加按钮值。当我选择＆＃34; call＆＃34;时，该值将为＆＃34; call＆＃34;在文本框中，假设当我选择＆＃34;会议＆＃34;时，该值将为＆＃34;会议＆＃34;在文本框中。

我的问题是，当我选择值为多个时，页面也会重定向。我找不到解决方案。谢谢你提前。

我的代码：

使用Javascript：

<script type="text/javascript">
function moveValue(num) {
    var txt = document.getElementById("subject").value;
    txt = txt + num;
    document.getElementById("subject").value = txt;
    }
</script>

HTML：

<div class="form-group">
                    <label class="col-lg-2 control-label">Subject<span class="text-danger">*</span></label>
                    <div class="col-lg-10">
                        <input type="text" id="subject" class="form-control holiday_name"  name="holiday_name" required>
                    </div>
                </div>

<div class="form-group row">
                    <button type="submit" class="btn btn-default col-md-2" value="Call" onclick="moveValue(this.value)"><i class="fa fa-phone"></i>&nbsp;Call</button>
                    <button type="submit" class="btn btn-default col-md-2" value="Meeting" onclick="moveValue(this.value)"><i class="fa fa-group"></i>&nbsp;Meeting</button>
                    <button type="submit" class="btn btn-default col-md-2" value="Task" onclick="moveValue(this.value)"><i class="fa fa-tasks"></i>&nbsp;Task</button>
                    <button type="submit" class="btn btn-default col-md-2" value="Deadline" onclick="moveValue(this.value)"><i class="fa fa-flag"></i>&nbsp;Deadline</button>
                    <button type="submit" class="btn btn-default col-md-2" value="Email" onclick="moveValue(this.value)"><i class="fa fa-envelope"></i>&nbsp;Email</button>
                    <button type="submit" class="btn btn-default col-md-2" value="Lunch" onclick="moveValue(this.value)"><i class="fa fa-cutlery"></i>&nbsp;Lunch</button>

                </div>

Answer 1

我的问题是，当我选择值为多个时，页面也会重定向。

因为您提交表单。请注意，您的按钮类型为submit。将它们更改为button，它不会尝试发送表单进行服务器处理。

<button type="button" class="btn btn-default col-md-2" value="Call" onclick="moveValue(this.value)"><i class="fa fa-phone"></i>&nbsp;Call</button>

Answer 2

首先你必须删除按钮中的submit属性，所以它不会重定向页面，这是一个有效的代码： https://jsfiddle.net/yrpwop7o/1/

javascript代码的正确版本是：

window.moveValue = function(num) {
    var subject = document.getElementById("subject");
    subject.value = num;
}

Answer 3

您应该将主题的值设置为从 onclick 事件传递的 num 。< / p>

＆＃13;

function moveValue(num) {
  var txt = document.getElementById("subject").value;
  //txt = txt + num; //remove this line because it will bind the values
  document.getElementById("subject").value = num;
  return false;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="form-group">
  <label class="col-lg-2 control-label">Subject<span class="text-danger">*</span>
  </label>
  <div class="col-lg-10">
    <input type="text" id="subject" class="form-control holiday_name" name="holiday_name" required>
  </div>
</div>

<div class="form-group row">
  <button type="submit" class="btn btn-default col-md-2" value="Call" onclick="moveValue(this.value);"><i class="fa fa-phone"></i>&nbsp;Call</button>
  <button type="submit" class="btn btn-default col-md-2" value="Meeting" onclick="moveValue(this.value);"><i class="fa fa-group"></i>&nbsp;Meeting</button>
  <button type="submit" class="btn btn-default col-md-2" value="Task" onclick="moveValue(this.value);"><i class="fa fa-tasks"></i>&nbsp;Task</button>
  <button type="submit" class="btn btn-default col-md-2" value="Deadline" onclick="moveValue(this.value);"><i class="fa fa-flag"></i>&nbsp;Deadline</button>
  <button type="submit" class="btn btn-default col-md-2" value="Email" onclick="moveValue(this.value);"><i class="fa fa-envelope"></i>&nbsp;Email</button>
  <button type="submit" class="btn btn-default col-md-2" value="Lunch" onclick="moveValue(this.value);"><i class="fa fa-cutlery"></i>&nbsp;Lunch</button>

</div>

＆＃13;

在这里，我想在文本框中添加按钮值

3 个答案: