使用jQuery在我的HTML文件中附加href链接

时间:2015-12-16 03:28:54

标签: jquery html

我的目标是使用jQuery从我的HTML下拉菜单中使用用户的选择动态地在我的页面上添加链接。一旦用户选择了他们的选项,我希望将其作为参数添加到<div class= "select"> <select name="scroll"> <option value="1">----- options -----</option> <option value="2" >A</option> <option value="3">B</option> <option value="4">C</option> <option value="5">D</option> <option value="6">E</option> </select> </div> <div class="link"> <a href="http://www.example.com"> link </a></div> URL的末尾(该URL是指向另一个站点的链接)

HTML:

var $char = $('.select').val(); 
   $(".select").change(function() {
   $char = $(this).val();
   alert($char);
});

$(".test").click(function(){
 $(".link").href.append("$char");
})

JavaScript的:

Sub StopTask()


Dim lr As Long
Dim lra As Range
Dim lrb As Range
'
lr = Sheets(2).Range("a" & Rows.count).End(xlUp).Row
Set lra =2 Sheets(2).Range("a" & lr + 1)
Set lrb = Sheets(2).Range("a" & lr)
Sheets(2).Range("a" & lr + 1).Formula = Now()
Sheets(2).Range("b" & lr + 1) = "Task Name"
Sheets(2).Range("c" & lr + 1) = "Stop"
Sheets(2).Range("d" & lr + 1).Value = Format(lra - lrb, "hh:mm:ss")
End Sub

4 个答案:

答案 0 :(得分:0)

使用attrtext方法:

$(".test").click(function(){
 $(".link a").attr('href',function(_,v){
   return v += $char;
 }).text($char);
});

答案 1 :(得分:0)

您需要编写位于SELECT t2.company, t2.city, t2.product, t1.surcharge INTO table3 FROM table2 t2 INNER JOIN table1 ON t1.company = t2.company AND t1.city = t2.city AND t1.product = t2.product DELETE FROM table1; INSERT INTO table1 (company, city, product, surcharge) SELECT company, city, product, surcharge FROM table3; div内的select元素的更改事件。 .select这里是.select的{​​{1}}名称。请将class附加到div。检查内联注释以了解其工作原理。

change event
select

答案 2 :(得分:0)

.select不属于下拉列表。所以你的改变事件永远不会发生。尝试以下。希望这会对你有所帮助。

&#13;
&#13;
var link = $(".link a");
        
$("select[name=scroll]").change(function() {
       var char = $(this).val();
             
       var url = link.attr('href').split('?')[0];
       link.attr('href', url + '?param_name=' + char); 
       //use your parameter name instead of param_name
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="select">
    <select name="scroll">
        <option value="1">----- options -----</option>
        <option value="2">A</option>
        <option value="3">B</option>
        <option value="4">C</option>
        <option value="5">D</option>
        <option value="6">E</option>
    </select>
</div>

<div class="link">  <a href="http://www.example.com"> link </a></div>
&#13;
&#13;
&#13;

答案 3 :(得分:0)

使用change()方法并使用split方法获取不带参数的网址,以更改href属性。还可以使用$(this)来捕获回调函数中更改的选择。

&#13;
&#13;
$('select[name="scroll"]').change(setUrl);

function setUrl(e) {
  //$(this) is the 'jQueryezed' select named "scroll"
  var $selectBar = $(this),
    linkContainer = $('#link-parameterized'),
    actualLink = linkContainer.attr('href'),
    newLink = actualLink.split('?')[0] + '?' + $selectBar.val();
  //Disable that the user selects the --- Select Name ---- option
  $selectBar.children().eq(0).attr('disabled', 'disabled');
  //Update the href attribute in the link container
  linkContainer.attr('href', newLink);
  //Check the new link
  alert(linkContainer.attr('href'));
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="select">
  <select name="scroll">
    <option>----- Select Name -----</option>
    <option value="john">A</option>
    <option value="pat">B</option>
    <option value="bill">C</option>
    <option value="jaco">D</option>
    <option value="miles">E</option>
  </select>
</div>

<div class="link">
  <!-- use id if this link it's the only one (I suppose that it's the case) that needs add a parameter -->
  <a id="link-parameterized" href="http://www.example.com"> link </a>
</div>
&#13;
&#13;
&#13;

http://goo.gl/7UoZaW