选择菜单中的onClick函数未创建选项

Question

  function getOption(){ var select = document.getElementById("dynamic-select"); if(select.options.length > 0) { var option = select.options[select.selectedIndex]; alert("Text: " + option.text + "\\nValue: " + option.value); } else { window.alert("Select box is empty"); } } function addOption(){ var select = document.getElementById("dynamic-select"); select.options[select.options.length] = new Option('New Element', '0', false, false); }

 <!DOCTYPE html> <html> <head> <title>Place Autocomplete Address Form</title> <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> <meta charset="utf-8"> <link type="text/css" rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <style> .pac-container { z-index: 10000 !important; } </style> </head> <body> <div class="container"> <div class="row"> <div class="col-md-6"> <h2>Shipping Method</h2> <form> <div class="form-group"> <div class="radio"> <label> <input type="radio" name="optradio" checked>Deliver To *</label> </div> </div> <div class="form-group"> <select id="dynamic-select"> <option value="None">Select Shipping</option> </select> </div> <div class="form-group"> <a data-toggle="modal" data-target="#myModal">Add Delivery Address</a> </div> <!-- Modal --> <div class="modal fade" id="myModal" role="dialog"> <div class="modal-dialog"> <!-- Modal content--> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">&times;</button> <h4 class="modal-title"><span><i class="fa fa-map-marker" aria-hidden="true"></i></span>Add your Delivery Details</h4> </div> <div class="modal-body"> <div class="panel panel-primary"> <div class="panel-heading"> <h3 class="panel-title">Address</h3> </div> <div class="panel-body"> <input id="autocomplete" placeholder="Enter your address" onFocus="geolocate()" type="text" class="form-control"> <br> <div id="address"> <div class="row"> <div class="col-md-6"> <label class="control-label">Street address</label> <input class="form-control" id="street_number"> </div> <div class="col-md-6"> <label class="control-label">Route</label> <input class="form-control" id="route"> </div> </div> <div class="row"> <div class="col-md-6"> <label class="control-label">City</label> <input class="form-control field" id="locality"> </div> <div class="col-md-6"> <label class="control-label">State</label> <input class="form-control" id="administrative_area_level_1"> </div> </div> <div class="row"> <div class="col-md-6"> <label class="control-label">Zip code</label> <input class="form-control" id="postal_code"> </div> <div class="col-md-6"> <label class="control-label">Country</label> <input class="form-control" id="country"> </div> </div> </div> <button type="submit" onclick="addOption()">Add NEW</button> </div> </div> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> </div> </div> </div> </div> </form> </div> </div> </div> </body> </html>

I'm new to Javascript and in this example, basically I have created a Shipping Method Page. 我是Java语言的新手，在这个示例中，基本上我已经创建了一个“运输方法”页面。 In the "ADD Delivery Address" link, on clicking there is a address form which needs to be filled out and after pressing the ADD NEW button, all the address form data should appear in the select menu option like in the picture below. 在“添加交货地址”链接中，单击时，需要填写一个地址表格，然后按“添加新”按钮，所有地址表格数据应出现在选择菜单选项中，如下图所示。 But I'm unable to do so. 但是我做不到。 Can someone please enlighten me on his. 有人可以给我启发一下他吗？ It would be a immense help to me. 这将对我有极大的帮助。 Thank you 谢谢

Answer 1

这是线路错误，html中不存在id newopt。

var newopt = $('#newopt').val();

选择菜单中的onClick函数未创建选项

问题描述

1 个解决方案

解决方案1
1 2018-08-21 07:47:40

选择菜单中的onClick函数未创建选项

问题描述

1 个解决方案

解决方案1 1 2018-08-21 07:47:40

解决方案1
1 2018-08-21 07:47:40