Question

它很简单，但我没有看到解决方案。

如何在这个twitter bootstrap弹出链接中放置一个php var？

<a href="#myModal" title="Lees meer" value="12345" data-toggle="modal">Read More</a>

如何在弹出字段中获取并打印此链接的值？

Answer 1

如果启用了短标签：

<a 
    href="#myModal" 
    title="Lees meer" 
    value="12345" 
    data-toggle="modal" 
    data-phpvar="<?=$myVariable?>"
>
    Read More
</a>

否则：

<a 
    href="#myModal" 
    title="Lees meer" 
    value="12345" 
    data-toggle="modal" 
    data-phpvar="<?php echo $myVariable; ?>"
>
    Read More
</a>

为缩减可读性而缩进 - 不要在实际HTML中执行此操作，它看起来很乱。

要在jQuery中获取它 - .data("variable")会自动获取以data- 开头的属性：

$("a[href=#myModal]").click(function() {
    alert($(this).data("phpvar"));
});

或使用.attr等效词：

$("a[href=#myModal]").click(function() {
    alert($(this).attr("data-phpvar"));
});

并以模态输出：

$("a[href=#myModal]").click(function() {
    var phpVariable = $(this).attr("data-phpvar");
    var modalObject = $($(this).attr("href"));
    modalObject.find(".modal-body").text(phpVariable); //You might also use .html()
});

JSFiddle demo of the code working

Answer 2

非常感谢 h2ooooooo

我启用了短标记，我将建立链接屁股跟随：

<a href="#myModal" 
   title="Bewerken" 
   role="button" 
   data-toggle="modal" 
   data-phpvar="<?php echo $value['i_id_pk'] . '||' . $value['c_user'] . '||'. $value['i_user_type_id_fk'];?>">
    <i class="icon-edit"></i>
</a>

我将带有JQuery的data-phpvar的值发送到#myModal Popup。我使用OnClick事件从href data-phpvar中获取值。像这样：

<script>
    $("a[href=#myModal]").click(function() {
        var str = $(this).attr("data-phpvar");
        var substr = str.split('||');

        $("[name=user_id]").val(substr[0]);
        $("[name=c_chance_user_name]").val(substr[1]);
        $("[name=validation_c_user]").val(substr[1]);
        $("[name=c_chance_user_type]").val(substr[2]);

        $("span.userName").text(substr[1]);
    });
</script>

它可以工作但是，我可以做这个JQuery更短或更好的方式吗？

最后，我将值放在弹出窗口内的文本域中的href data-phpvar中。文本字段必须与JQuery名称具有相同的名称：

。
$（ “[名称= USER_ID]”）VAL（SUBSTR [0]）; 要么 $（ “[名称= c_chance_user_name]”）VAL（SUBSTR 1）;

弹出窗口中的html文本字段如下：

    <div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
            <h3 id="myModalLabel">Wijzig gebruiker "<span class="userName"></span>"</h3>
        </div>
        <div class="modal-body">
             <input class="span3" id="appendedPrependedInput" type="text" name="c_chance_user_name" value="" minlength="3" required />
             <input class="span3" type="text" data-validation-match-match="c_chance_user_name" name="validation_c_user" minlength="3" required />
        </div>
        <div class="modal-footer">
             <button class="btn" data-dismiss="modal" aria-hidden="true">Sluiten</button>
             <button class="btn btn-success" name="chanceBtn"><li class="icon-ok-circle icon-white"></li> Opslaan</button>
        </div>
    </div>

您可以在www.twitter.github.com/
上找到此弹出式插件

将数据放入#myModal popup Twitter Bootstrap中

2 个答案: