Error-prone code randomly started working, but the

问题:

I'm trying to install the "selectize-rails" gem. I was having a lot of trouble ( TypeError: $(...).selectize is not a function ) so I gave up for a while and worked on unrelated things. Then I returned to it, and the gem was suddenly working, though none of the code I had changed was at all relevant to it. I then altered one line of code and refreshed the page to see the result, and it once again displayed the same error in the web console it had before:

TypeError: $(...).selectize is not a function

After that, this is literally all I did: 1) pressed "back" in my text editor to revert the change, 2) saved the document, and 3) refreshed the page. And, the error was still there, although the exact same code had worked only seconds before.

Does anyone know how that's possible?

Here's the block of code that didn't work, then suddenly started working, then stopped again:

<script type="text/javascript">

  $(document).ready(function() {
    console.log( typeof $.fn.selectize === 'function'); // true
    console.log( $('#select-to').length === 1 ); // true

    var REGEX_EMAIL = '([a-z0-9!#$%&\'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&\'*+/=?^_`{|}~-]+)*@' + '(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?)';

    $('#select-to').selectize({
      persist: false,
      maxItems: null,
      valueField: 'email',
      labelField: 'name',
      searchField: ['name', 'email'],
      options: [ 
        {email: '[e-mail]', name: 'Brian Reavis'},
        {email: '[e-mail]', name: 'Nikola Tesla'},
        {email: '[e-mail]'}
      ],
      render: {
        item: function(item, escape) {
          return '<div>' +
            (item.name ? '<span class="name">' + escape(item.name) + '</span>' : '') +
            (item.email ? '<span class="email">' + escape(item.email) + '</span>' : '') +
          '</div>';
        },
        option: function(item, escape) {
          var label = item.name || item.email;
          var caption = item.name ? item.email : null;
          return '<div>' +
            '<span class="label">' + escape(label) + '</span>' +
            (caption ? '<span class="caption">' + escape(caption) + '</span>' : '') +
          '</div>';
        }
      },
      createFilter: function(input) {
        var match, regex;

        // [e-mail]
        regex = new RegExp('^' + REGEX_EMAIL + '$', 'i');
        match = input.match(regex);
        if (match) return !this.options.hasOwnProperty(match[0]);

        // name <[e-mail]>
        regex = new RegExp('^([^<]*)\<' + REGEX_EMAIL + '\>$', 'i');
        match = input.match(regex);
        if (match) return !this.options.hasOwnProperty(match[2]);

        return false;
      },
      create: function(input) {
        if ((new RegExp('^' + REGEX_EMAIL + '$', 'i')).test(input)) {
          return {email: input};
        }
        var match = input.match(new RegExp('^([^<]*)\<' + REGEX_EMAIL + '\>$', 'i'));
        if (match) {
          return {
            email : match[2],
            name : $.trim(match[1])
          };
        }
        alert('Invalid email address.');
        return false;
      }
    });
  });
</script>

I changed this line:

{email: '[e-mail]'}

to this:

{email: '<%= link_to "home", root_path %>'}

and then back.