Question

我是javascript的初学者。我试图通过传递参数在单个函数中传递多个函数。我想为两者写一个函数。这是我的两个js功能代码。请帮我解决这个问题。有两个字段，这两个字段的保存按钮最初显示：无;当我点击编辑按钮时会改为显示：inline-block;最初将在单击编辑字段后禁用字段以进行编辑。当我点击编辑＆＃34;编辑＆＃34;文本更改为＆＃34;取消＆＃34;当我再次点击取消时，文字会更改为＆＃34; eidt＆＃34;

enter image description here

＆＃13;

$('#edit_data_info').on('click', function() {
  var text = $('#edit_data_info').text();
  if (text === "Edit") {
    $(this).html('Cancel');
  } else {
    $(this).text('Edit');
  }
  toggleInfo();
});

function toggleInfo() {
  $("#save-name").toggle();
  $(".heighlight").toggleClass("heighlights");
}

$('#edit_data_email').on('click', function() {
  var text = $('#edit_data_email').text();
  if (text === "Edit") {
    $(this).html('Cancel');
  } else {
    $(this).text('Edit');
  }
  toggleEmail();
});

function toggleEmail() {
  $("#save-email").toggle();
  $(".heighlight-email").toggleClass("heighlights");
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form class="form-acc-details heighlight" role="form" id="demo">
  <div class="info-details">
    <div class="info">
      <h1 class="personal-info">Personal Information</h1>
      <button type="button" class="edit-data" id='edit_data_info'>Edit</button>
    </div>
    <div class="fill-information">
      <div class="fill-form-info form-group col-md-4">
        <input type="text" class="my-info form-control" id="change_fname" value="john" pattern="^[a-zA-Z][a-zA-Z0-9-_\.]{1,20}$" title="Atleast two Characters" disabled required/>
      </div>
      <div class="fill-form-info form-group col-md-4">
        <input type="text" class="my-info form-control" id="change_lname" value="grey" pattern="^[a-zA-Z][a-zA-Z0-9-_\.]{1,20}$" title="Atleast two characters" disabled required/>
      </div>
      <button type="submit" class="btn-submit btn btn-primary" id="save-name">Save</button>
    </div>
  </div>
</form>
<form class="form-acc-details heighlight-email" role="form" class="recorrect_email">
  <div class="info-email">
    <div class="info">enter code here
      <h1 class="personal-info">Email Address</h1>
      <button type="button" class="edit-data" id='edit_data_email'>Edit</button>
      <button type="button" class="btn btn-information btn-lg" data- toggle="modal" data-target="#myModal" id='change-pwd'>Change Password</button>
    </div>
    <div class="fill-information">
      <div class="fill-form-info form-group col-md-4">
        <input type="email" class="my-info form-control" value="Abcd@gmail.com" id="change_email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,3}$" title="characters followed by an @ sign, followed by more characters, and then a .dot and must not contain capital letters" disabled required/></div>
      <button type="submit" class="btn-submit btn btn-primary" id="save-email">Save</button>
    </div>
  </div>
</form>

＆＃13;

Answer 1

像这样：）

$('#edit_data_email, #edit_data_info').on('click', function () 
{
    var button=${this}.attr('id');
    var text=$(this).text();
    if(text === "Edit")
    {
        $(this).html('Cancel');
    } 
    else
    {
        $(this).text('Edit');
    }
    toggleElement(button);
});

function toggleElement(button)
{
    if(button == 'edit_data_email') {
        $("#save-email").toggle();
        $(".heighlight-email").toggleClass("heighlights");
    }
    if(button == 'edit_data_info') {
        $("#save-name").toggle();
        $(".heighlight").toggleClass("heighlights");
    }
}

如何通过传递参数在单个函数中调用多个函数

1 个答案: