0 
<script type="text/javascript"  src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script>

function open(url) {
    $('#blockdiv').fadeIn();
    $('#iframe').attr('src', url);
    $('#containerdiv').fadeIn();   
}

function close() {  
    $('#blockdiv').fadeOut();
    $('#containerdiv').fadeOut();  
}

$(document).ready(function() {
  $('ul').css({width: $('#containerdiv').width(),height:$('#containerdiv').height()})
     $('#close').click( function() { close() })
     $('#nj_apply').click( function() { open('http://www.yahoo.com/') })

});

</script>

<td>
<input id= "nj_apply" type=button value="Apply" >
</td>

在上面的代码中，url(http://www.yahoo.com/)被硬编码在 script 标签中。但我想从输入标签本身将 url 传递给上面的 jquery 函数。每当我单击应用按钮时，它应该将 url 传递给上面的 jQuery 函数。

有可能做到吗？

4

2 回答 2

1

使用data-...属性和jQuerydata方法：

function open(url) {
    $('#blockdiv').fadeIn();
    $('#iframe').attr('src', url);
    $('#containerdiv').fadeIn();   
}

function close() {  
    $('#blockdiv').fadeOut();
    $('#containerdiv').fadeOut();  
}

$(document).ready(function() {
  $('ul').css({width: $('#containerdiv').width(),height:$('#containerdiv').height()})
     $('#close').click( function() { close() })
     $('#nj_apply').click( function() { open($(this).data('url')); })

});

</script>

<td>
<input id= "nj_apply" type=button value="Apply" data-url="http://www.yahoo.com/">
</td>
于 2013-07-28T00:46:51.900 回答
1

对的，这是可能的....

这使用onblur, 并将读取用户输入的值，只要他单击框....然后将该 vlue 传递给函数...

或者你可以做onkeyup，或者change，让它在用户输入时执行。

 $(document).ready(function() {
  $('ul').css({width: $('#containerdiv').width(),height:$('#containerdiv').height()})
 $('#close').click( function() { close() })

 $('#nj_apply').onblur( function() { 
   var url =  $(this).val();
   open(url); })

 });

 </script>

<td>
<input id= "nj_apply" type="text" />
</td>

上面的方式你甚至不必点击任何按钮，它会自动执行，onblur....但是如果你想点击一个按钮，这样做......

在你的 javascript...

$('#applytheurl').click( function(e) {
   e.preventDefault(); 
 var url =  $("#nj_apply").val();
  open(url); })
 });

你的 HTML...

 <td>
<input id= "nj_apply" type="text" />
<button id="applytheurl">GET PAGE</button>
</td>

编辑

我可能误解了你想要的......

下面的答案是，如果您打算有多个按钮，每个按钮都转到不同的页面......

你的 HTML...

<td>
<input class="geturl" type="button" value="Apply" data-url="www.test.com" />
<input class="geturl" type="button" value="Apply" data-url="www.test2.com" />
<input class="geturl" type="button" value="Apply" data-url="www.test3.com" />
<input class="geturl" type="button" value="Apply" data-url="www.test4.com" />
</td>

你的 javascript...

$('.geturl').click( function(e) {
 e.preventDefault(); 
 var url =  $(this).data('url');
 open(url); })
 });
于 2013-07-28T00:48:49.397 回答