Question

我正在构建一个Outlook格式化程序，并且在获取表单中输入值以显示在copyDiv上时遇到问题。它显示除了输入值之外的所有内容。我认为focus（）方法可能有问题。我该如何解决这个问题，以便显示输入？这是我的源代码：

$(document).ready(function() {

  var firstName = $("#firstName").val();
  var lastName = $("#lastName").val();

  var lastNameLC = lastName.toLowerCase();
  var firstInitial = firstName.substr(0, 1);
  var firstInitialLC = firstInitial.toLowerCase();
  var firstInitialLast = firstInitial.concat(lastName);

  var theWholeString = "New-RemoteMailbox -Alias " + firstInitialLast + " -Name " + '"' + firstName + " " + lastName + '"' + " -FirstName " + firstName + " -LastName " + lastName + " -DisplayName " + '"' + firstName + lastName + '"' + " -UserPrincipalName " + firstInitialLC + lastNameLC + "@belmont.gov -RemoteRoutingAddress " + firstInitialLC + lastNameLC + "@belmont.gov.onmicrosoft.com -OnPremisesORganizationalUnit ";

  var finalString = "";

  $("#submitButton").click(function() {

    $('input[type="checkbox"]').click(function() {
      if ($(this).prop("checked")) {
        finalString = theWholeString + "blueone.pd/PDUser";
      } else {
        finalString = theWholeString + "belmont.local/BelmontUsers";
      }
    });

    $("#copyDiv").html(finalString).end().appendTo($("body"));
  });

  return false;
});

function changeFocus(id) {
  var v = "#" + id;
  $(v).focus();
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<body>
  <div class="container" style="margin-top:120px">
    <div class="row">
      <div class="col-xs-6 col-xs-offset-3">
        <h4>1. Enter name:</h4>
        <form id="nameForm" method="post" action="">
          <div class="form-group">
            <label for="firstName" class="sr-only">First:</label>
            <input class="form-control" id="firstName" name="firstName" type="text" placeholder="First Name" value="" />
          </div>
          <div class="form-group">
            <label for="lastName" class="sr-only">Last:</label>
            <input class="form-control" id="lastName" name="lastName" type="text" placeholder="Last Name" value="" />
          </div>
          <div class="check-box">
            <label for="policeDept">Police Department?</label>
            <input type="checkbox" id="pdCheck" data-group-cls="btn-group-sm">
          </div>
          <button class="btn btn-primary pull-right" id="submitButton" type="button" value="Submit" />Make </button>
        </form>
      </div>
      <div class="row">
        <div class="col-xs-6 col-xs-offset-3">
          <h4>2. Copy this text:</h4>
          <div id="copyDiv" class="panel panel-default" style="padding:10px">Result
          </div>
        </div>
      </div>
    </div>
  </div>
</body>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

Answer 1

当用户点击提交按钮时，您需要从输入字段中获取值，而不是在页面加载时获取。

你不需要复选框的点击处理程序，只需让提交功能测试复选框是否被选中。

我无法看到changeFocus()功能的任何需要，它似乎与您的问题无关。

＆＃13;

$(document).ready(function() {
  $("#submitButton").click(function() {

    var firstName = $("#firstName").val();
    var lastName = $("#lastName").val();

    var lastNameLC = lastName.toLowerCase();
    var firstInitial = firstName.substr(0, 1);
    var firstInitialLC = firstInitial.toLowerCase();
    var firstInitialLast = firstInitial.concat(lastName);

    var finalString;

    var theWholeString = "New-RemoteMailbox -Alias " + firstInitialLast + " -Name " + '"' + firstName + " " + lastName + '"' + " -FirstName " + firstName + " -LastName " + lastName + " -DisplayName " + '"' + firstName + lastName + '"' + " -UserPrincipalName " + firstInitialLC + lastNameLC + "@belmont.gov -RemoteRoutingAddress " + firstInitialLC + lastNameLC + "@belmont.gov.onmicrosoft.com -OnPremisesORganizationalUnit ";
    if ($(':checkbox').is(":checked")) {
      finalString = theWholeString + "blueone.pd/PDUser";
    } else {
      finalString = theWholeString + "belmont.local/BelmontUsers";
    }

    $("#copyDiv").html(finalString).appendTo($("body"));
  });

  return false;
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<body>
  <div class="container" style="margin-top:120px">
    <div class="row">
      <div class="col-xs-6 col-xs-offset-3">
        <h4>1. Enter name:</h4>
        <form id="nameForm" method="post" action="">
          <div class="form-group">
            <label for="firstName" class="sr-only">First:</label>
            <input class="form-control" id="firstName" name="firstName" type="text" placeholder="First Name" value="" />
          </div>
          <div class="form-group">
            <label for="lastName" class="sr-only">Last:</label>
            <input class="form-control" id="lastName" name="lastName" type="text" placeholder="Last Name" value="" />
          </div>
          <div class="check-box">
            <label for="policeDept">Police Department?</label>
            <input type="checkbox" id="pdCheck" data-group-cls="btn-group-sm">
          </div>
          <button class="btn btn-primary pull-right" id="submitButton" type="button" value="Submit" />Make </button>
        </form>
      </div>
      <div class="row">
        <div class="col-xs-6 col-xs-offset-3">
          <h4>2. Copy this text:</h4>
          <div id="copyDiv" class="panel panel-default" style="padding:10px">Result
          </div>
        </div>
      </div>
    </div>
  </div>
</body>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

＆＃13;

jQuery focus（）方法不起作用？

1 个答案: