Question

var arr = [];
$('.inp').click(function(){

function arrcall() {
            $.each(arr, function(key, value) {
                alert('Array Key is: ' + key + ' \n Array Key value is: ' + value);
            });
        }

  var id = $(this).attr('id');
  var value = $(this).val();
  
  if(value == 'empty') {
    this.value = id + 'ON';
    value = $(this).val();
    arr.push(value);
    arrcall();
    $('.txt').val(arr.join(','));
    return false;
  }
  if(value == id + 'ON') {
    arr.splice(arr.indexOf(value), 1)
    this.value = id + 'OFF';
    value = $(this).val();
    arr.push(value);
    arrcall();
    $('.txt').val(arr.join(','));
    return false;
  }
  if(value == id + 'OFF') {
    arr.splice(arr.indexOf(value), 1)
    this.value = 'empty';
    value = $(this).val();
    arrcall();
    $('.txt').val(arr.join(','));
    return false;
  }
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <input class='txt' type='input'>
  
  <label>X</label>
  <input class='inp' id='x' type='button' value='empty'>
  
  <label>Y</label>
  <input class='inp' id='y' type='button' value='empty'>
  
  <label>Z</label>
  <input class='inp' id='z' type='button' value='empty'>
</form>

我正在尝试更改输入的值并将其添加到.txt输入中，现在我的问题是通过其数组键将标签按下来

例如

如果我点击Z button然后X button然后点击Y button并将其转为ON或OFF我希望他们拥有index key number + 1所以标签将变为

X-2[xON] Y-3[yON] Z-1[zON]

如果我再次将其中一个转为empty，则索引会再次正确排序这些数字。

所以如果我Z button OFF按钮就是

X-1[xON] Y-2[yON] Z[empty]

Answer 1

在您加载新阵列后，您可以遍历所有输入，搜索其在阵列中的位置，以修改标签。试试这个......

var arr = [];

function arrcall() {
    $.each(arr, function(key, value) {
        alert('Array Key is: ' + key + ' \n Array Key value is: ' + value);
    });
}

$('input.inp').click(function(e) {

    e.preventDefault();

    var id = $(this).attr('id');
    var value = this.value;
    var position = arr.indexOf(value);

    if (value == 'empty') {
        this.value = id+'ON';
        arr.push(this.value);
    }
    else if (value == id+'ON') {
        this.value = id+'OFF';
        arr[position] = this.value;
    }
    else if (value == id+'OFF') {
        this.value = 'empty';
        arr.splice(position,1);
    }

    arrcall();

    $('input.txt').val(arr.join(','));

    // Loop through all your inputs, search its value and modify label.        
    $('input.inp').each(function() {
        var pos = 0;
        if ((pos = arr.indexOf($(this).val())) >= 0)
            $(this).prev('label').text($(this).attr('id')+'-'+(pos+1));
        else
            $(this).prev('label').text($(this).attr('id'));
    });

})

我希望它有所帮助。

将数组索引号添加到标签

1 个答案: