寻找演员 JS

Question

我正在创建一个函数来查找我搜索的演员制作的所有电影，这些电影在一个 js 文件中，如下所示：

var filmlist = [ 
  {"Title":"Killer's Kiss", "Actors":"Frank Silvera, Jamie Smith, Irene Kane, Jerry Jarrett"}
];

var a = document.getElementById("film");

function findActors() {
  var x = document.getElementById("actor").value;
  var y = document.getElementById("actorfilm");

  a.innerHTML = "Movies with this actor: " 
  for (var i=0; i<filmlist.length; i++) {
    if (x.indexOf(filmlist[i].Actors) !== -1) {
      y.innerHTML = (filmlist[i].Title + "<br/>")
    }
  }
}

<textarea rows="2" cols="50" id="actor" placeholder="write actor name, and press the button"></textarea>
<button onclick="findActor()">ActorButton</button>

<p id="film"></p>
<p id="actorfilm"></p>

由于某种原因，它不会显示演员，但会显示第一个 a.innerhtml 我对 javascript 非常陌生，因此不胜感激。

Answer 1

您快到了，只是您的if 条件需要反转。

if (filmlist[i].Actors.indexOf(x) )

您是在在您输入的值内检查演员的超集，而不是反其道而行之。

你可以做的更精确

var filteredFilms = filmlist.filter( s => s.Actors.indexOf(x) != -1 );
var output = filteredFilms.map( s => s.Title ).join( "<br/>" );

演示

var filmlist = [{
  "Title": "Killer's Kiss",
  "Actors": "Frank Silvera, Jamie Smith, Irene Kane, Jerry Jarrett"
}];

var a = document.getElementById("film");

function findActors() {

  var x = document.getElementById("actor").value;
  var y = document.getElementById("actorfilm");
  a.innerHTML = "Movies with this actor: "
  var filteredFilms = filmlist.filter(s => s.Actors.indexOf(x) != -1);
  y.innerHTML = filteredFilms.map(s => s.Title).join("<br/>");

}

<!-- find actor function -->
<textarea rows="2" cols="50" id="actor" placeholder="write 
actor name, and press the button">Frank Silvera</textarea>

<button onclick="findActors()">ActorButton</button>


<p id="film"></p>

<p id="actorfilm"></p>

Answer 2

您当前正在用最后一个电影标题覆盖y.innerHTML。要附加到innerHTML，请使用：

y.innerHTML += (filmlist[i].Title + "<br/>")

您的 indexOf 存在问题，在另一个答案中提到，可以用

修复

if (filmlist[i].Actors.indexOf(x)) {

最后，您的 HTML 错误地引用了 js 函数，而应该是：

<button onclick="findActors()">ActorButton</button>