Question

当元素A，B或C发生变化时，它们会更改filename.a，filename.b等的属性。

但输入值仅分配一次。有没有办法让输入文本值在构成变量时发生变化？

或者我必须更新每个change函数内的文本。我必须违反DRY并在$("#filename").val(filename.a + " " + filename.b + " " + filename.c);内加入类似的内容。

以下不起作用，因为输入文本不是＆＃34;绑定＆＃34;对于变量，只需分配一次。

<input type="text" id="filename" />
<script>
$("#elementA").on("change",function() {
  filename.a = $(this).text();
});
$("#elementB").on("change",function() {
  filename.b = $(this).text();
});
$("#elementC").on("change",function() {
  filename.c = $(this).text();
});
$("#filename").val(filename.a + " " + filename.b + " " + filename.c);
</script>

Answer 1

尝试以下代码

<script>
  function assignValue(){
      $("#filename").val($("#elementA").text() + " " + $("#elementB").text() + " " + $("#elementC").text());
  }


  $(function(){
    $('#elementA, #elementB, #elementC').on('change', function(){
      assignValue();
    });
  });
</script>

Answer 2

只需给所有private TestContextManager testContextManager; @Before public void login() throws Exception { testContextManager = new TestContextManager(getClass()); testContextManager.prepareTestInstance(this);一个类，从而为该类元素中的所有更改/ keyup提供一个事件监听器。

然后，您可以选择是否要在键入keystorkes（即：elements）时或在离开文本框（即：.change（）之后）填充文件名。

在我的下面的代码段中，我更喜欢keyup()，因为它在主题背景下更有意义。

＆＃13;

.keyup()

＆＃13;

$('.elements').keyup(function(){

   // if you want, you may use [ $().change() ] instead of [ $().keyup() ]

   var a = $('#elementA').val();
   var b = $('#elementB').val();
   var c = $('#elementC').val();
   
   $('#filename').val(a + ' '  + b  + ' ' + c);
});

＆＃13;

Answer 3

$("#elementA, #elementB, #elementC").on("change",function() {

  var val = $(this).text();

  if($(this).is("#elementA"))
    filename.a = val;
  else if($(this).is("#elementB"))
    filename.b = val;
  else if($(this).is("#elementC"))
    filename.c = val;

  $("#filename").val(filename.a + " " + filename.b + " " + filename.c);

});

您可以在所有输入上只有一个事件处理程序，并根据更改的输入更改filename对象的值。

然后仅在更改事件处理程序中更新#filename的值。

更新

您可以做的另一件事是可以动态计算属性的名称。

$("#elementA, #elementB, #elementC").on("change",function() {

  var val = $(this).text();

  var id = this.id; // Will have 'elementA'
  var prop = id.replace("element", "").toLowerCase(); // Will have 'a'

  filename[prop] = val;

  $("#filename").val(filename.a + " " + filename.b + " " + filename.c);

});

组件变量值更改jQuery时输入文本更改

3 个答案:

更新