jQuery 需要刷新才能获取 html()

Question

我在表单中的每个链接上自动生成输入标记，使链接中的 .html() 成为输入 val()。 我想要获取的文本位于 标记内，这就是我使用 .children() 函数的原因。

问题是这段代码需要刷新页面才能正常工作。但是 var htmltoval return 'undefined' 我尝试将此循环放在 $(document).ready 之前、之后、等等...

我猜是因为元素是动态添加的。

代码如下：

var content_input = '<input class="btn_menu_search" type="radio"/>';
$('form#form_search a').after(content_input);

$('#form_search :input').each(function () {
    var htmltoval = $(this).prev('a').children().html().toLowerCase();
    console.log(htmltoval) // return undefined on first page load 
    // however return the inner html string as expected
    var htmltoval = htmltoval.split(' ').join('');
    $(this).val(htmltoval);
});  

有什么想法吗？

在此处更新 html：

<form method="post" action="#" id="form_search">
                    <h4 class="title"><span><strong>Villes</strong></span></h4>

                        <ul class="list-arrow" id="bienes">
                            <li><a class="bienes"><strong>Paris</strong></a></li>
                            <li><a class="bienes"><strong>Londres</strong></a> </li>
                            <li><a class="bienes"><strong>Tokyo</strong></a></li>
                            <li><a class="bienes"><strong>Moscou</strong></a></li>
                            <li><a class="bienes"><strong>Rio de Janeiro</strong></a></li>
                        </ul>

 <!-- etc-->
</form>

编辑：页面刷新后即使清除缓存也能正常工作。该错误仅在第一次浏览器加载时出现。

Answer 1

我不知道它是否会改变某些东西，但我在console.log(htmltoval) 这一行添加了一个分号，并将htmltoval 的声明放在each 循环之外。我还通过使用类来更改循环元素：

var content_input = '<input class="btn_menu_search" type="radio"/>';
$('form#form_search a').after(content_input);

var htmltoval = "";
$('.btn_menu_search').each(function () {
    htmltoval = $(this).prev('a').children().html().toLowerCase();
    console.log(htmltoval); // return undefined on first page load 
    // however return the inner html string as expected
    htmltoval = htmltoval.split(' ').join('');
    $(this).val(htmltoval);
});  

见jsFiddle