javascript - HTML jQuery : Pass selected value onclick to elements name

Question

我目前有一个下拉菜单，因此用户可以选择一个选项来优化搜索，如下所示:

<button name = "toggle" tabindex="-3" data-toggle="dropdown" class="btn btn-default dropdown-toggle" type="button">
<span class="caret"></span>
<span class="sr-only">Toggle Dropdown</span>
</button>

<ul class="dropdown-menu" >
<li><a href="#" name="restuatant"><span class="t">restaurant</span></a></li>
<li><a href="#" name="active"> <span class="t">beauty salon</span></a></li>
<li><a href="#" name="bars"> <span class="t">bars</span></a></li>
<li class="divider"></li>
<li><a href="#" name="other"> <span class="t">other</span></a></li>
</ul>

我想要做的是，当从下拉菜单中选择一个选项来更新元素名称时，这样我就可以在提交表单后访问表单上选择的任何内容。那一刻我得到了这个:

$(document).ready(function(){
     $('ul.dropdown-menu li').click(function()
     {
       var field = document.createElement("input");
       field.name=$(this).find("span.t").text();
     }
     });
     });

我将如何去做我指定的事情，因为我有点不确定

Answer 1

如果我正确理解了问题，您想要创建一个 input 元素并在点击事件上更新它的 name 属性。如果是这种情况，您可以编码:

$(document).ready(function() {
     // create an input and append to #somewhere
     var $field = $('<input>').appendTo('#somewhere');
     $('ul.dropdown-menu li').click(function() {
         $field.prop('name', $(this).find("span.t").text());
     });
});

如果该元素应在第一次单击时生成:

var $field;
$('ul.dropdown-menu li').click(function() {
     var name = $(this).find("span.t").text().trim();
     if ( !$field ) {
        $field = $('<input>', {
           'type': 'text'
        }).appendTo('#somewhere');
     }
     $field.prop('name', name);
});