为什么通过event.target获取搜索按钮的值？据我所知，event对象对应于表单提交，所以最好直接获取它。
此外，像onsubmit()这样的内联属性是一个不好的做法，请使用addEventListener()方法。
然后，调用main()函数，更新本地存储，并在提交表单时获取<input>的值。
这是你的最终代码。

• 我注解了与本地存储相关的所有内容，因为它在Stack Snippets中不起作用。*

const movieListEl = document.querySelector(".shows");
const moviesForm = document.getElementById("movie__searchbox");

async function main(event) {
    const url = `https://www.omdbapi.com/?apikey=39a36280&s=${encodeURI(event)}`;
    const search = await fetch(`${url}`);
    const data = await search.json();
    movieListEl.innerHTML = data.Search.map((movie) => movieHTML(movie)).join("");
}

// check when the form is submitted
moviesForm.addEventListener("submit", (event) => {
    const searchBarValue = document.getElementById("searchbar").value; // get input's value everytime the form is submitted
    console.log(searchBarValue);
    event.preventDefault(); // prevent refresh
    // localStorage.setItem("key", searchBarValue);
    // const searchKey = localStorage.getItem("key");
    main(searchBarValue);
});

function movieHTML(details) {
    return `<div class="shows__content">
        <figure class="shows__poster">
            <img src="${details.Poster}" alt="" class="poster">
        </figure>
           <div class="poster__description">
            <h4 class="poster__title">${details.Title}</h4>
            <p class="poster__year">${details.Year}</p>
        </div>
    </div>
        `;
}

个字符
请参阅此JSFiddle以获得使用本地存储的工作版本。

问题

通过在browse函数中访问event.target.value，您将获得表单的值，而不是输入的值。

潜在解决方案

我编辑了你的snipped，并给输入一个名称searchbarinput，以便browse函数可以通过名称引用它。

注意：我只是注解掉了localStorage.setItem，这样示例就可以在Stack Overflow上运行

备选方案：

您还可以将表单（event.target）传递给FormData构造函数。

const movieListEl = document.querySelector('.shows');
    const searchKey = localStorage.getItem("key");
    
    async function main (event) {
        const url = `https://www.omdbapi.com/?apikey=39a36280&s=${encodeURI(event)}`;
         const search = await fetch(`${url}`);
        const data = await search.json();
        // console.log(data.Search)
        movieListEl.innerHTML = data.Search.map((movie) => movieHTML(movie)).join("");
    
    }

    main(searchKey);

   function browse(event){
        event.preventDefault();
        console.log(event.target.elements.searchbarinput.value);
        //localStorage.setItem("key", event.target.value); 
    }
    
    function movieHTML (details) {
    return `<div class="shows__content">
        <figure class="shows__poster">
            <img src="${details.Poster}" alt="" class="poster">
        </figure>
           <div class="poster__description">
            <h4 class="poster__title">${details.Title}</h4>
            <p class="poster__year">${details.Year}</p>
        </div>
    </div>
        `
    }

个字符