入力テキストの変更をフォームに送信

Question

私はこの質問が何百万回も聞かれたことは知っていますが、私は何かを得ることができないようです。私はうまく動作しているリンクの1つをクリックすると入力値の値を得ようとしていますが、リンクがクリックされるとすぐに送信ボタンがなくても自動的にフォームを送信したいと思います。現時点では、入力フィールドをクリックしない限り動作しません。また、私はリンクにIDを追加することはできません。これは私がこれまで持っていたものです。

var $Form = $('form'), $Container = $('#container'); 
 
$Container.hide(); 
 
$Form.on('click', function(p_oEvent){ 
 
    var sUrl, sMovie, oData; 
 
    p_oEvent.preventDefault(); 
 
sMovie = $Form.find('input').val(); 
 
    sUrl = 'https://www.omdbapi.com/?t=' + sMovie + '' 
 
    $.ajax(sUrl, { 
 
     complete: function(p_oXHR, p_sStatus){ 
 
      oData = $.parseJSON(p_oXHR.responseText); 
 
      console.log(oData); 
 
      $Container.find('.title').text(oData.Title); 
 
      $Container.find('.plot').text(oData.Plot); 
 
      $Container.find('.poster').html('<img src="' + oData.Poster + 
 

 
'"/>'); 
 
      $Container.find('.year').text(oData.Year); 
 
      $Container.show(); 
 
     } 
 
    });  
 
}); 
 

 
$(function() { 
 
    $('a').on('click', function() { 
 
     var text = $('#text'); 
 
     text.val($(this).text());  
 
    }); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<a href="#">rocky</a><br> 
 
<a href="#">Back To The Future</a><br> 
 
<a href="#">Spaceballs</a><br> 
 

 
<form id="omdbform"> 
 
     <input type="text" name="movie" placeholder="movie title" id="text" onchange="this.form.submit();"> 
 
</form> 
 

 
<div id="container"> 
 
    <h3 class="title">Title</h3> 
 
    <span class="year">Year</span> 
 
    <span class="poster">Poster</span> 
 
    <p class="plot">Plot</p> 
 
</div>

任意の助けいただければ幸いです。

追加リンク例 <a href="/family_photos/filename1.jpg">filename1.jpg</a> <a href="/family_photos/filename2.jpg">filename2.jpeg</a>

Answer 1

変更あなたのリンク機能を以下に：

$(function() { 
    $('a').on('click', function() { 
     var text = $('#text'); 
     var fileName =$(this).text(); 
     fileName = fileName.replace(/\.[^/.]+$/, ""); 
     text.val(fileName);  
     $Form.click(); 
    }); 
}); 

Answer 2

は "上" 使用する前に、次のコード

var $Form = $('form') 
$Container = $('#container'); 
$Container.hide(); 
$("body").on("submit", "form", function(p_oEvent){ 
    var sUrl, sMovie, oData; 
    p_oEvent.preventDefault(); sMovie = $Form.find('input').val(); 
    sUrl = 'https://www.omdbapi.com/?t=' + sMovie + '' 
    $.ajax(sUrl, { 
     complete: function(p_oXHR, p_sStatus){ 
      oData = $.parseJSON(p_oXHR.responseText); 
      console.log(oData); 
      $Container.find('.title').text(oData.Title); 
      $Container.find('.plot').text(oData.Plot); 
      $Container.find('.poster').html('<img src="' + oData.Poster + 

'"/>'); 
      $Container.find('.year').text(oData.Year); 
      $Container.show(); 
     } 
    });  }); 

    $('a').on('click', function (e) { 
     e.preventDefault(); 
     var text = $('#text'); 
     text.val($(this).text()); 
     $("form").submit(); 
    }); 

を試してみてくださいhttp://api.jquery.com/on/