Vue: Placeholder in Chinese will trigger the input event in IE 10&11 while I did nothing at all

Created on 22 Mar 2017 · 6Comments · Source: vuejs/vue

Version

2.2.4

Reproduction link

https://jsfiddle.net/array_huang/rdsz159r/

Steps to reproduce

I can't test my code in jsfiddle with any IE browser. So maybe you need to test it in the local file with IE 11 and IE 10 emulator.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  <div id="app">
    <form action="">
      <input type="text" @input="alert('placeholder in Chinese trigger the input event');" placeholder="中文">
      <input type="text" @input="alert('it does not show at first');" placeholder="Chinese233333">
    </form>
  </div>
  <script src="./vue.min.js"></script>
  <script>
    var app = new Vue({
      el: '#app',
      data: {
      },
      methods: {
        alert: function(content) {
          alert(content);
        }
      }
    })
  </script>
</body>
</html>

What is expected?

I expected that the input event will be triggered when I focus on the Input element.
So if I do nothing, the input event should not have been triggered.

What is actually happening?

A Input element without placeholder or with placeholder in non-Chinese work fine.A Input element with placeholder in Chinese(maybe any language besides english) will be triggered as soon as I visit the web page, before I do anything.

I tried my test case in IE 10 emulator of IE 11 on Windows 10 and IE 11 itself.

Source

Array-Huang

Most helpful comment

https://jsfiddle.net/rdsz159r/4/
looks like a browser problem
i tried at a IE11 emulator without Vue

Kingwl on 22 Mar 2017

👍3

All 6 comments

https://jsfiddle.net/rdsz159r/4/
looks like a browser problem
i tried at a IE11 emulator without Vue

Kingwl on 22 Mar 2017

👍3

Well, as @Kingwl has demonstrated, I don't think there's much we can do about this in Vue...

yyx990803 on 24 Mar 2017

@yyx990803 Can you get me some advice to circumvent this problem, please?

Array-Huang on 24 Mar 2017

i got the same problem

holidaying on 17 May 2017

I'm having the same problem, also without chinese.

The input keeps triggering on blur, I saw that it trigger the e.target.selectionStart sometimes.

I was thinking about creating a data that keeps the moment you click on input and see if you type something and when you delete it complete fire something to correct it, I'll keep trying.