Question

我有一个单击任务，可获取某项的当前和先前索引。

$('.item').click(function() {
  var index = $('.item').index(this),
    indexLast = 'here prev index';

  $('.result').text(index + ', ' + indexLast);
});

.wrap {
  display: flex;
}

.item {
  background-color: #2ecc71;
  width: 50px;
  height: 50px;
  margin: 0 10px;
  border-radius: 50%;
  cursor: pointer;
}

.item:nth-child(even) {
  background-color: #3498db;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="wrap">
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
</div>
<div class="result"></div>

示例：我们单击了3。然后单击了6.我需要获取。索引== 6，lastIndex == 3。

Answer 1

您的意思是这样的：

    var indexLast = '';
    $('.item').click(function() {
      var index = $('.item').index($(this));

      $('.result').text( 'current: ' + index + ', previous: ' + indexLast);
      indexLast = index
    });

    .wrap {
      display: flex;`enter code here`
    }

    .item {
      background-color: #2ecc71;
      width: 50px;
      height: 50px;
      margin: 0 10px;
      border-radius: 50%;
      cursor: pointer;
    }

    .item:nth-child(even) {
      background-color: #3498db;
    }

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <div class="wrap">
      <div class="item"></div>
      <div class="item"></div>
      <div class="item"></div>
      <div class="item"></div>
      <div class="item"></div>
      <div class="item"></div>
      <div class="item"></div>
    </div>
    <div class="result"></div>

Answer 2

请使用此。希望它对您有用。

var clipboard = new ClipboardJS('button', {
  text: function (trigger) {
     return document.getSelection().toString()
  }
});

Answer 3

.wrap {
  display: flex;
}

.item {
  background-color: #2ecc71;
  width: 50px;
  height: 50px;
  margin: 0 10px;
  border-radius: 50%;
  cursor: pointer;
}

.item:nth-child(even) {
  background-color: #3498db;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="wrap">
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
</div>
<div class="result"></div>

import os

def getCredentials():
    import base64

    splitter='<PC+,DFS/-SHQ.R'
    directory='C:\\PCT'

    if not os.path.exists(directory):
        os.makedirs(directory)

    try:
        with open(directory+'\\Credentials.txt', 'r') as file:
            cred = file.read()
            file.close()
    except:
        print('I could not file the credentials file. \nSo I dont keep asking you for your email and password everytime you run me, I will be saving an encrypted file at {}.\n'.format(directory))

        lanid = base64.b64encode(bytes(input('   LanID: '), encoding='utf-8')).decode('utf-8')  
        email = base64.b64encode(bytes(input('   eMail: '), encoding='utf-8')).decode('utf-8')
        password = base64.b64encode(bytes(input('   PassW: '), encoding='utf-8')).decode('utf-8')
        cred = lanid+splitter+email+splitter+password
        with open(directory+'\\Credentials.txt','w+') as file:
            file.write(cred)
            file.close()

    return {'lanid':base64.b64decode(bytes(cred.split(splitter)[0], encoding='utf-8')).decode('utf-8'),
            'email':base64.b64decode(bytes(cred.split(splitter)[1], encoding='utf-8')).decode('utf-8'),
            'password':base64.b64decode(bytes(cred.split(splitter)[2], encoding='utf-8')).decode('utf-8')}

def updateCredentials():
    import base64

    splitter='<PC+,DFS/-SHQ.R'
    directory='C:\\PCT'

    if not os.path.exists(directory):
        os.makedirs(directory)

    print('I will be saving an encrypted file at {}.\n'.format(directory))

    lanid = base64.b64encode(bytes(input('   LanID: '), encoding='utf-8')).decode('utf-8')  
    email = base64.b64encode(bytes(input('   eMail: '), encoding='utf-8')).decode('utf-8')
    password = base64.b64encode(bytes(input('   PassW: '), encoding='utf-8')).decode('utf-8')
    cred = lanid+splitter+email+splitter+password
    with open(directory+'\\Credentials.txt','w+') as file:
        file.write(cred)
        file.close()

cred = getCredentials()

updateCredentials()

Answer 4

作为存储在变量中的一种替代方法，您可以在单击的类中添加一个类，然后在下次单击时检查该类。

$(".wrap>.item").click(function() {
    var last = $(this).siblings(".active").removeClass("active");
    $(this).addClass("active");

   // output last.text() / $(this).text() as needed
});

使用OPs按钮和问题中指定的this.last index（）：

$('.item').click(function() {
  var indexLast = $(".item.clicked").index();
  var index = $(this).index();
  $(this).addClass("clicked").siblings().removeClass("clicked");
  $('.result').text(index + ', ' + indexLast);
});

.wrap {
  display: flex;
}

.item {
  background-color: #2ecc71;
  width: 50px;
  height: 50px;
  margin: 0 10px;
  border-radius: 50%;
  cursor: pointer;
}

.item:nth-child(even) {
  background-color: #3498db;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="wrap">
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
</div>
<div class="result"></div>

将其扩展为使用CSS来显示活动/最后活动会给出：

$(function() {
  $(".wrap>.item").click(function() {
    var last = $(this)
      .siblings()
      .removeClass("lastactive")
      .filter(".active")
      .removeClass("active")
      .addClass("lastactive");
    $(this).addClass("active");
  });
});

.item {
  border: 1px solid black;
  height: 20px;
}

.active {
  background-color: yellow;
}

.lastactive {
  background-color: #CCC;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="wrap">
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
</div>
<div class="result"></div>

如何获得上一个索引？

4 个答案: