行情

Question

我有一个创建LI和href元素的函数。

function getsubject(s) {

    if (s <= 10) {
        var sub = ['Choose subject','math', 'physics', 'chemistry', 'biology'];
    } else {
        var sub = [ 'Choose subject','math', 'physics', 'chemistry', 'biology', 'accounts', 'BMT'];
    }

    var subList = sub.length;

    // var subl = document.getElementById("listul");
    // var a =  document.querySelectorAll('#listul .sli').length;

    var elements = document.getElementsByClassName("sli");
    while(elements.length > 0){
         elements[0].parentNode.removeChild(elements[0]);
    }

    var liElem="";
    for(var a =0;a<subList;a++){
        liElem += '<li class="sli"><a  href="#" onclick="ub('+sub[a]+');">'+sub[a]+'</a></li>';
    }

    document.getElementById('listul').innerHTML=liElem;
}

和HTML

<div class="list select_style">
    <ol id="listul">
      <li><a href="">choose subject</a></li>
   </ol>
</div>

当我使用创建的函数传递时，没有参数可以工作。当我从函数传递参数时无法正常工作。

Answer 1

行情

您必须将带引号的变量传递给onclick。

现在getsubject(s)追加字符串：

<li class="sli"><a  href="#" onclick="ub(chemistry);">chemistry</a></li>

您可以注意到onclick处理程序无效，因为它在未定义的值ub上调用chemistry函数。

但是你可以在像ub("chemistry")这样的字符串上调用函数。

因此，解决方案是在函数调用中的值周围加上引号：

for(var a =0;a<subList;a++){
    liElem += '<li class="sli"><a  href="#" onclick="ub(\''+sub[a]+'\');">'+sub[a]+'</a></li>';
}

模板文字

更好的方法（但并非所有浏览器都可以使用ECMAScript模板文字：

for(var a =0;a<subList;a++){
    liElem += `
        <li class="sli">
            <a href="#" onclick="ub('${sub[a]}');">
                ${sub[a]}
            </a>
        </li>
    `;
}

模板文字可以用作带有""或''引号的普通字符串，但它可以是多行的，可以包含符号${variable}，这意味着可以放置variable的值在该字符串中的那个地方。

JQuery方法

值得考虑比普通文本html渲染更好的东西。

使用jQuery的等效代码如下所示：

var liNode = $('<li class="sli"></li>');
$('<a href="#"></a>').click(function() {
    // Call ud from the handler when link is clicked
    ud(value);
}).appendTo(liNode);
liNode.appendTo($('.sli'));

javascript参数函数在href中不起作用

1 个答案:

行情

模板文字

JQuery方法