使用OnClick进行JavaScript函数调用(JavaScript Function Call With OnClick)
我有一个简单的函数,它在硬编码时有效,但是当我尝试将第二个参数传递给它时,它不起作用。 我用
onclick
调用函数并使用id => thumbnail
来获取值。 有什么建议么?硬编码示例(作品)
<script> function clearFileInputField(tagId) { document.getElementById(tagId).innerHTML = document.getElementById(tagId).innerHTML; $('.thumbnail').val(""); } </script> <div id="thumbnail_div" class="row"> <?php echo $form->labelex($model,'thumbnail'); ?> <?php echo $form->textfield($model,'thumbnail', array(placeholder => "No file chosen", readonly => true, 'class' => 'thumbnail')); ?><br> <?php echo $form->filefield($model,'thumbnail'); ?> <?php echo $form->error($model,'thumbnail'); ?> <input type="checkbox" onclick = "clearFileInputField('thumbnail_div')" href="javascript:noAction();"> Remove Thumbnail </div>
传递的参数(不工作)
<script> function clearFileInputField(tagId, div) { document.getElementById(tagId).innerHTML = document.getElementById(tagId).innerHTML; $('.div').val(""); } </script> <div id="thumbnail_div" class="row"> <?php echo $form->labelex($model,'thumbnail'); ?> <?php echo $form->textfield($model,'thumbnail', array(placeholder => "No file chosen", readonly => true, 'id' => 'thumbnail')); ?><br> <?php echo $form->filefield($model,'thumbnail'); ?> <?php echo $form->error($model,'thumbnail'); ?> <input type="checkbox" onclick = "clearFileInputField('thumbnail_div', 'thumbnail')" href="javascript:noAction();"> Remove Thumbnail </div>
I have a simple function that works when it is hard coded, but when I try to pass a second parameter into it, it doesn't work. I am calling the function with the
onclick
and using theid => thumbnail
to get the value. Any suggestions?Hard Coded Example (Works)
<script> function clearFileInputField(tagId) { document.getElementById(tagId).innerHTML = document.getElementById(tagId).innerHTML; $('.thumbnail').val(""); } </script> <div id="thumbnail_div" class="row"> <?php echo $form->labelex($model,'thumbnail'); ?> <?php echo $form->textfield($model,'thumbnail', array(placeholder => "No file chosen", readonly => true, 'class' => 'thumbnail')); ?><br> <?php echo $form->filefield($model,'thumbnail'); ?> <?php echo $form->error($model,'thumbnail'); ?> <input type="checkbox" onclick = "clearFileInputField('thumbnail_div')" href="javascript:noAction();"> Remove Thumbnail </div>
Parameters Passed (Not Working)
<script> function clearFileInputField(tagId, div) { document.getElementById(tagId).innerHTML = document.getElementById(tagId).innerHTML; $('.div').val(""); } </script> <div id="thumbnail_div" class="row"> <?php echo $form->labelex($model,'thumbnail'); ?> <?php echo $form->textfield($model,'thumbnail', array(placeholder => "No file chosen", readonly => true, 'id' => 'thumbnail')); ?><br> <?php echo $form->filefield($model,'thumbnail'); ?> <?php echo $form->error($model,'thumbnail'); ?> <input type="checkbox" onclick = "clearFileInputField('thumbnail_div', 'thumbnail')" href="javascript:noAction();"> Remove Thumbnail </div>
原文:https://stackoverflow.com/questions/30102808
更新时间:2022-11-11 22:11
最满意答案
问题是您在页面加载时检查输入的值,但在用户单击按钮时则不会。
所以解决方案是在用户点击按钮时检查它。
(function(){ //get ADD IN BOOK LIST button //get bookname tagname var addlist_button = $('input[name=addlist]'); addlist_button.on('click', function(event){ var book_name = $('input[name=bookname]').val(); if((book_name == "")||(book_name == null)){ alert('fail'); } else{ alert(book_name); } }); })();
<form action="" method="POST"> <script src="https://code.jquery.com/jquery-3.0.0.js"></script> <p>POST TITLE</p> <input type="text" name="title" placeholder="Insert title" required> <p>INSERT BOOK NAME</p> //user will input value this text box <input type="text" name="bookname" placeholder="book name"> <input type='button' name="addlist" value="ADD IN BOOK LIST"> <ul class="booklist"> </ul> <input type="submit" id='button'>//create post button </form>
The problem is that you check the value of the input on page load but not when the user clicks on the button.
So the solution is to check it when user clicks on the button.
(function(){ //get ADD IN BOOK LIST button //get bookname tagname var addlist_button = $('input[name=addlist]'); addlist_button.on('click', function(event){ var book_name = $('input[name=bookname]').val(); if((book_name == "")||(book_name == null)){ alert('fail'); } else{ alert(book_name); } }); })();
<form action="" method="POST"> <script src="https://code.jquery.com/jquery-3.0.0.js"></script> <p>POST TITLE</p> <input type="text" name="title" placeholder="Insert title" required> <p>INSERT BOOK NAME</p> //user will input value this text box <input type="text" name="bookname" placeholder="book name"> <input type='button' name="addlist" value="ADD IN BOOK LIST"> <ul class="booklist"> </ul> <input type="submit" id='button'>//create post button </form>
相关问答
更多-
首先需要使用$ function包装this ,因为这是由选择查询而不是jQuery对象返回的DOM元素,并且val()函数在该类对象上不可用。 此外,您需要使用括号调用val()函数,否则您正在处理函数的主体,而不是它返回的值。 最后,在赋值语句中有一个拼写错误。 你应该至少做this.val = '' ,但这不起作用,因为val是一个函数,而不是一个变量。 工作代码应如下所示: $("input[type='text'][name='quantity']").change(function() { ...
-
使用value属性不是innerHTML从输入元素获取值。 获取click处理程序中的值以获取更新的值。 $(document).ready(function() { "use strict"; var outPutfield = document.getElementById("oPf"); function appendOutput(where, what) { where.innerHTML = what; }; $('#sendd').click(func ...
-
$("#find").val("newvalue"); 不知道为什么你的工作不起作用。 您可能还需要输入上的name属性? 不确定这是否重要...... 它也可以在创建输入之前运行。 在哪种情况下将其包装 $(document).ready(function(){ //anything you want to do once the elements are all there. }); 或者只是在源代码中的元素之后粘贴脚本块(这可能是一个有争议的建议)。 $("#find").val("new ...
-
问题是您在页面加载时检查输入的值,但在用户单击按钮时则不会。 所以解决方案是在用户点击按钮时检查它。 (function(){ //get ADD IN BOOK LIST button //get bookname tagname var addlist_button = $('input[name=addlist]'); addlist_button.on('click', function(event){ var book_name = $('input ...
-
if-else是一个条件语句,根据条件返回true和false 。 在您的情况下,您在Input not compare / get中分配/设置值。 > $("#colorScheme input").val("") //--means you set "" value to specific input box 因此,如果要检查值为“”的文本输入,则需要使用以下语句: if($("#colorScheme input").val() == ""){ $("#colorScheme input").a ...
-
在$(this).each(function() { , this将返回调用哪个事件的element 。使用$('.getAmount')选择器获取具有类的所有元素的值作为getAmount 注意:还使用input事件而不是keyup $('#dynamicDiv').on('input', '.getAmount', function(event) { var total = 0; $('.getAmount').each(function() { total += parseInt ...
-
jQuery文本输入?(jQuery text to input?)[2021-12-24]
使用jQuery replaceWith() : $(document).ready(function(){ $("a").click(function(e){ e.preventDefault(); $(this).parent().replaceWith(""); }); }); http://jsfiddle.net/Dqkyg/1/ 此外,您可以使用链接外的文本填充文本框,如下所示: $(document).ready(functi ... -
您可以使用.val()来获取输入值。要获取值数组,您应该使用$.map方法: var values = $('.unique_class').map(function() { return $(this).val(); }).get(); 另请注意,如何使用.get方法将类似jQuery数组的集合转换为实际数组。 To get an array of values you should use $.map method: var values = $('.unique_class').map(function() { ret ...您可以反转循环并从最后一个开始。 var $set = $('.date'); var len = $set.length; var firstVal = $($set[0]).val(); var lastVal = null; for (var i = len - 1; i > 0; i--){ if ($($set[i]).val()){ lastVal = $($set[i]).val(); break; } } You can reverse your loop and ...
相关文章
更多- error C2668: 'M' : ambiguous call to overloaded function
- 我一点onclick为什么总是提交表单
- 如何在runtime重载javascript alert函数
- 两种js function 声明方式
- 请教javascript问题
- [hook.js]通用Javascript函数钩子及其他
- javascript日期相加函数
- javascript函数与对象
- Hadoop源码分析之二(RPC机制之Call处理)
- 用Javascript实现添加删除表格行
最新问答
更多- 您如何使用git diff文件,并将其应用于同一存储库的副本的本地分支?(How do you take a git diff file, and apply it to a local branch that is a copy of the same repository?)
- 将长浮点值剪切为2个小数点并复制到字符数组(Cut Long Float Value to 2 decimal points and copy to Character Array)
- OctoberCMS侧边栏不呈现(OctoberCMS Sidebar not rendering)
- 页面加载后对象是否有资格进行垃圾回收?(Are objects eligible for garbage collection after the page loads?)
- codeigniter中的语言不能按预期工作(language in codeigniter doesn' t work as expected)
- 在计算机拍照在哪里进入
- 使用cin.get()从c ++中的输入流中丢弃不需要的字符(Using cin.get() to discard unwanted characters from the input stream in c++)
- No for循环将在for循环中运行。(No for loop will run inside for loop. Testing for primes)
- 单页应用程序:页面重新加载(Single Page Application: page reload)
- 在循环中选择具有相似模式的列名称(Selecting Column Name With Similar Pattern in a Loop)
- System.StackOverflow错误(System.StackOverflow error)
- KnockoutJS未在嵌套模板上应用beforeRemove和afterAdd(KnockoutJS not applying beforeRemove and afterAdd on nested templates)
- 散列包括方法和/或嵌套属性(Hash include methods and/or nested attributes)
- android - 如何避免使用Samsung RFS文件系统延迟/冻结?(android - how to avoid lag/freezes with Samsung RFS filesystem?)
- TensorFlow:基于索引列表创建新张量(TensorFlow: Create a new tensor based on list of indices)
- 企业安全培训的各项内容
- 错误:RPC失败;(error: RPC failed; curl transfer closed with outstanding read data remaining)
- C#类名中允许哪些字符?(What characters are allowed in C# class name?)
- NumPy:将int64值存储在np.array中并使用dtype float64并将其转换回整数是否安全?(NumPy: Is it safe to store an int64 value in an np.array with dtype float64 and later convert it back to integer?)
- 注销后如何隐藏导航portlet?(How to hide navigation portlet after logout?)
- 将多个行和可变行移动到列(moving multiple and variable rows to columns)
- 提交表单时忽略基础href,而不使用Javascript(ignore base href when submitting form, without using Javascript)
- 对setOnInfoWindowClickListener的意图(Intent on setOnInfoWindowClickListener)
- Angular $资源不会改变方法(Angular $resource doesn't change method)
- 在Angular 5中不是一个函数(is not a function in Angular 5)
- 如何配置Composite C1以将.m和桌面作为同一站点提供服务(How to configure Composite C1 to serve .m and desktop as the same site)
- 不适用:悬停在悬停时:在元素之前[复制](Don't apply :hover when hovering on :before element [duplicate])
- 常见的python rpc和cli接口(Common python rpc and cli interface)
- Mysql DB单个字段匹配多个其他字段(Mysql DB single field matching to multiple other fields)
- 产品页面上的Magento Up出售对齐问题(Magento Up sell alignment issue on the products page)