title: How can I prevent executing onclick event on <a> tag automatically?
body: <p>I have a textarea and search box which are made dynamically. When users search a word, a popup will show the data includes the word.
  Users click the data, it goes to the textarea.</p>
  
  <p>It's a simple process.</p>
  
  <p>So I wrote this code.</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;button type="submit" class="btn btn-info btn-sm float-right" onclick="answer()"&gt;ANSWER&lt;/button&gt;
  </code></pre>
  
  <pre class="lang-js prettyprint-override"><code>function answer() {
    //console.log('answer');
    var div = document.createElement('div');
  
    div.className = 'row';
    div.innerHTML = '&lt;!-- file form start --&gt;\
                  &lt;!-- file form end --&gt;\
                  &lt;!-- text form start --&gt;\
                  {!! Form::open([ 'route' =&gt; ['qnamembercreate', $qnaMemberData-&gt;idx], 'method' =&gt; 'post', 'files' =&gt; true, 'accept-charset' =&gt; 'utf-8' ])!!}\
                  &lt;div class="col-md-12 col-xs-12"&gt;\
                        &lt;div class="card-body"&gt;\
                            &lt;div class="col-sm-6 offset-md-6 p-0"&gt;\
                                &lt;div class="input-group"&gt;\
                                    &lt;input type="text" id="f_search" name="f_search" class="form-control"&gt;\
                                    &lt;span class="input-group-append"&gt;\
                                        &lt;button type="button" class="btn waves-effect waves-light btn-inverse" onclick="faq_search()"&gt;검색&lt;/button&gt;\
                                    &lt;/span&gt;\
                                &lt;/div&gt;\
                            &lt;/div&gt;\
                            &lt;input type="hidden" name="subject" value="{{ $qnaMemberData-&gt;subject }}"&gt;\
                            &lt;textarea id="answer_content" class="mb-0" rows="20" style="width:100%;" name="add_answer"&gt;&lt;/textarea&gt;\
                            &lt;div class="form-group"&gt;\
                              &lt;input name="fileToUpload" type="file" class="filestyle" data-input="false" id="filestyle-1" tabindex="-1" style="display: none;"&gt;\
                              &lt;div class="bootstrap-filestyle input-group"&gt;\
                                &lt;div style="position: absolute; width: 100%; height: 35.375px; z-index: -1;"&gt;&lt;/div&gt;\
                                &lt;span class="group-span-filestyle " tabindex="0"&gt;\
                                  &lt;label for="filestyle-1" style="margin-bottom: 0;" class="btn btn-secondary btn-sm fload-right"&gt;\
                                    &lt;input type="file" name="fileToUpload" class="filestyle-1" data-placeholder="" data-buttontext="첨부파일" data-buttonname="btn-secondary"&gt;\
                                  &lt;/label&gt;\
                                &lt;/span&gt;\
                              &lt;/div&gt;\
                            &lt;/div&gt;\
                            &lt;button type="button" class="btn btn-danger btn-sm float-right ml-1 mt-1" onclick="history.back()"&gt;취소&lt;/button&gt;\
                            &lt;button type="submit" class="btn btn-success btn-sm float-right mt-1"&gt;등록&lt;/button&gt;\
                        &lt;/div&gt;\
                    &lt;/div&gt;\
                    {!! Form::close() !!}\
                    &lt;!-- text form end --&gt;';
  
    document.getElementById('replyData').appendChild(div);
    document.getElementById('answer').remove();
  
    $('#answer_content').summernote({
        tabsize: 2,
        height: 200,
        lang: 'ko-KR',
        fontNames: ['Gulim',  'Arial', 'Arial Black', 'Comic Sans MS', 'Courier New', ],
        fontNamesIgnoreCheck: ['Gulim'],
    });
  }
  
  // FAQ Search
  function faq_search() {
      var word = $('#f_search')[0].value;
      $.ajax({
          url : '/guidesearch',
          type : 'POST',
          data : {
              keyword: word
          },
          cache : false,
          success : function(data, jqXHR, textStatus) {
              console.log(data);
              faq_popup(data);
          }
      });
  }
  
  // faq_popup
  function faq_popup(data) {
      var _html = '';
      _html = '&lt;div class="modal fade show" tabindex="-1" id="myModal" role="dialog" style="positon:center;"&gt;\
                &lt;div class="modal-dialog modal-dialog-centered"&gt;\
                  &lt;!-- Modal content--&gt;\
                    &lt;div class="modal-content"&gt;\
                      &lt;div class="table-responsive"&gt;\
                              &lt;table class="table mb-0"&gt;\
                                  &lt;tbody&gt;';
  
      for (var i = 0; i &lt; data.length; i++) {
          _html += '&lt;tr&gt;\
                      &lt;th scope="row"&gt;'+ (i + 1) +'&lt;/th&gt;\
                       &lt;td&gt;&lt;a style="cursor:pointer" onclick="'+ getContent(data[i]['content']) +'"&gt;' + data[i]['subject'] + '&lt;/a&gt;&lt;/td&gt;\
                     &lt;/tr&gt;';
      }
  
      _html += ' &lt;/tbody&gt;\
                &lt;/table&gt;\
              &lt;/div&gt;\
            &lt;/div&gt;\
          &lt;/div&gt;\
        &lt;/div&gt;';
  
      $('#modal_place').append(_html);
      $('#myModal').modal('show');
  }
  
  function getContent(data) {
      //console.log(data);
      $('#answer_content').summernote('code', data);
      $('#myModal').modal('hide');
  }
  </code></pre>
  
  <p>But the problem is, the <code>getContent</code> function execute automatically before I click the subject.
  I searched for some solutions that suggest just remove the parenthesis, but in my case, I need to pass the parameter so I cannot remove the parenthesis.</p>
  
  <p>How can I prevent this automatic execution and make it right?</p>