jquery_jeditable:从先例输入控制最大数目

Question

我有这样的问题，用jquery_jeditable来控制最大数的先例输入。我想要先例值的第二个小值或相等，但我不明白如何捕获当前“字段”(this.id)的id，以构建先例号的id并读取其值。谢谢您的帮助--简单的html：

​

$('.editable-text').editable('save.php',{
                id:'pk',
                type:'number',
                tooltip:'____',
                placeholder:'Grams',
                max:2000,
                width:50
                
});

                
$('.editable-text2').editable('save.php',{
                id:'pk',
                type:'number',
                tooltip:'____',
                placeholder:'Grams',
                max:function(id){return $('#'+id+'_wInit').text()},
                width:50
                
});

console.log('precedent value first row: '+$('#1_wEnd_wInit').text())

console.log('precedent value second row: '+$('#2_wEnd_wInit').text())

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jeditable.js/2.0.17/jquery.jeditable.min.js"></script>

<span style="display: inline-block;width:80px;">Precedent</span>
&nbsp;
<span style="display: inline-block;width:80px;">Actual</span>
<br/>
<span style="display: inline-block;width:80px;" id="1_wEnd_wInit" class="editable-text" >1000</span>
&nbsp;
<span style="display: inline-block;width:80px;" id="1_wEnd" class="editable-text2">60</span>
<br/>
<span style="display: inline-block;width:80px;" id="2_wEnd_wInit" class="editable-text" >500</span>
&nbsp;
<span style="display: inline-block;width:80px;" id="2_wEnd" class="editable-text2" >20</span>

​

Answer 1

另一种方法是使用event.currentTarget，这将引用当前元素，即clicked，即：editable-text2，然后使用.attr("id")获取id并将其设置为max。

演示代码：

$('.editable-text').editable('save.php', {
  id: 'pk',
  type: 'number',
  tooltip: '____',
  placeholder: 'Grams',
  max: 2000,
  width: 50

});


$(".editable-text2").editable('save.php', {
  id: 'pk',
  type: 'number',
  tooltip: '____',
  placeholder: 'Grams',
  max: function() {
    //use currenttarget
    var id = $(event.currentTarget).attr("id")
    console.log($(event.currentTarget).attr("id"))
    console.log($('#' + id + '_wInit').text())
    return $('#' + id + '_wInit').text()
  },
  width: 50

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jeditable.js/2.0.17/jquery.jeditable.min.js"></script>

<span style="display: inline-block;width:80px;">Precedent</span> &nbsp;
<span style="display: inline-block;width:80px;">Actual</span>
<br/>
<span style="display: inline-block;width:80px;" id="1_wEnd_wInit" class="editable-text">1000</span> &nbsp;
<span style="display: inline-block;width:80px;" id="1_wEnd" class="editable-text2">60</span>
<br/>
<span style="display: inline-block;width:80px;" id="2_wEnd_wInit" class="editable-text">500</span> &nbsp;
<span style="display: inline-block;width:80px;" id="2_wEnd" class="editable-text2">20</span>

​