点击jQuery不会在第一次点击时触发。

Question

I am loading jquery.ime editor which supports the multi language editing, using this library https://github.com/wikimedia/jquery.ime/blob/master/examples/ced/script.js , there behavior is on "change" they are loading corresponding language JSON. I need that work on button click. on button click i am opening modal window, there I have text field, where I have write in regional languages. I know the language code based on that corresponding language is coming there, but right now the issue is I am able write in regional language on second click of button.

Here is my code:

open(writecontent: TemplateRef<any>, countvalue,books) {

  this.config.keyboard = false;
  this.modalRef = this.modalService.show(writecontent, Object.assign({}, this.config,{ class: 'gray modal-lg' }));

$( document ).ready( function () {
  'use strict';

  var $ced, ime, $imeSelector, $langSelector;

  $.ime.setPath( '../../' );
  $ced = $( '#ced' );
  // Initialise IME on this element
  $ced.ime( {
    showSelector: false
  } );
  // Get the IME object
  ime = $ced.data( 'ime' );

  ime.enable();
  $imeSelector = $( '#imeSelector' );
  $langSelector = $( '#go' );
  $langSelector.click(function() {

  ime.setLanguage(books.language[0].language_id);

  });

$ced.on( 'imeLanguageChange', function () {
    listInputMethods( ime.getLanguage() );
  });

    function listInputMethods( lang ) {
    $imeSelector.empty();
    ime.getInputMethods( lang ).forEach( function ( inputMethod ) {
      $imeSelector.append(
        $( '<option/>' ).attr( 'value', inputMethod.id ).text( inputMethod.name )
      );
    });
    $imeSelector.trigger( 'change' );
  }

   $imeSelector.on( 'change', function () {
     var inputMethodId = $imeSelector.find( 'option:selected' ).val();
     ime.load( inputMethodId ).done( function () {
       ime.setIM( inputMethodId );
     });
  });
 });

}

HTML CODE

<button id="go" (click)="open(books)" [ngClass]="{'disabled': disbutton}" [disabled]="disbutton" class="cl_add">ADD CONTENT</button>
<ng-template #writecontent>

    <div class="modal-header">
        <button type="button" class="close pull-right" aria-label="Close" (click)="modalRef.hide();destrory()">
            <span aria-hidden="true">&times;</span>
        </button>
        <h4 class="modal-title text-center"> write Content</h4>

    </div>
    <div class="modal-body" role="application">
        <form ngNativeValidate (ngSubmit)="onSubmit()" #writeContentForm="ngForm">

            <div class='imeSelector' style="display:none">
                <select id="imeSelector"></select>
            </div>
            <div>
                <label for="regLang">Title</label>
                <input type="text" id="ced" class="txt_book_inf" name="regLang" minlength="10" maxlength="150" required />
            </div>

            <div>
                <label class="new_span_txt">Write Content</label>

                <textarea id="mytextareaid" name="mytextareaid" rows="20" cols="80" style="width: 100%; height:200px;"></textarea>
            </div>
            <div id="message"></div>

            <br />
            <div class="text-center">
                <button type="submit" class="btn-left" class="btn btn-primary">SAVE</button>
            </div>
        </form>
    </div>
</ng-template> 

And i am working on Angular project both id and angular click event on the same button is that causing the issue ?

Answer 1

problem with click event after making this change its working fine.

    $(document).on("click", "#go", function(){


});